数组结果出不来

源自：3-1 todolist功能开发

数组结果出不来

    <body>
        <div id="root">
            <input v-model="inputvalue" />
            <button @click="handlesubmit">提交</button>
        </div>
        <ul>
            <li v-for="(item,index) of list" :key="index">
               {{item}}
            </li>
        </ul>
   </body>
   <script>
       new Vue({
            el:"#root",
            data:{
               inputvalue:'',
               list:[]
            },
            methods: {
               handlesubmit:function(){
                   this.list.push(this.inputvalue)
                   this.inputvalue=''
               }
            }
       })
   </script>

提问者：qq_Onecallaway_1 2018-08-06 14:56

个回答

慕码人0226809

2020-04-15 21:09:17

你 ul li 放挂载点div外面了还有你脚本放body外面了

0
哈尔波儿

2018-09-26 16:10:51

<body>
<div id="root">
<input v-model="content" />
<button @click="handle">提交</button>
<ul>
<li v-for="(item,index) of list" :key="index">{{item}}</li>
</ul>

<script>

new Vue({
el: "#root",
data:{
content:"",
list:[]
},
methods:{
handle:function(){
this.list.push(this.content);
this.content="";

}
}
})
</script>
</body>

0
zouz

2018-09-03 11:03:55

ul 不在挂载点内超出作用范围

1
展少专属

2018-08-27 20:52:09

函数名命名使用驼峰命名法handleSubmit

0
慕码人1229851

2018-08-07 16:34:34

<script>包含在</body>外了

0
咸314

2018-08-07 09:24:19

你的id=root包裹的不对，只包裹到button那边，并没有包裹到ul

1
Howe_94

2018-08-06 15:57:51

v-for="(item,index) of list" :key="index" 放在ul中

0
摩菲0

2018-08-06 15:57:25

        <div id="root">
            <input v-model="inputvalue" />
            <button @click="handlesubmit">提交</button>

        <ul>
            <li v-for="(item,index) of list" :key="index">
                {{item}}
            </li>
        </ul>
        </div>

2