components

Register the component in Vue:

Vue.component("todo-item",{
        template:"<li>This is the component</li>"
 })

To register a global component, it must be registered before instantiating vue, otherwise the page will not be displayed;

To pass data from the parent scope to the child component, you need to define a property props in the child component to receive the data, and use v-bind in html to bind the defined props property to the loop variable (item)

Vue.component("todo-item",{
        template:"<li>{{todo}}</li>",
        props:["todo"]
    })
    var vm=new Vue({
        el:"#app",
        data:{
            name:"zyy",
            age:23,
            see:false,
            ayy: ["aaa","bbb","ccc"]
        }
 });

  

 <todo-item v-for="item in ayy" v-bind:todo="item"></todo-item>

  

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324781607&siteId=291194637