怎么读取component组件里面的动态数据？

 <div class="form-group" id="22">
            <control-label label="姓名:"></control-label>
            <span  v-for="modal in addInputs"><ui-input></ui-input></span>
            <ui-button  id="add-input" label="新增input"  v-on:click="addInput()"></ui-button>
            <ui-button  id="remove-input" label="移除input"  v-on:click="removeInput()"></ui-button>
        </div>

        <div class="form-group">
            <ui-button  id="remove-input" label="保存"  v-on:click="save()"></ui-button>
        </div>
    
    js:
     //定义模块
    var label=Vue.extend({
        props:{
            label:''
        },
        template:'<label class="control-label" v-text="label"></label>'
    });
    var input=Vue.extend({
        template:'<input type="text" placeholder="请输入" v-model="msg"/>'
    });
    var button=Vue.extend({
        // props:['idName','checkText'],
        props:{
            id:'',
            label:''
        },
        template:'<button type="button" class="btn btn-primary" v-bind:id="id" v-text="label"></button>'
    });

    Vue.component('control-label',label);
    Vue.component('ui-input',input);
    Vue.component('ui-button',button);

    var form=new Vue({
        el:'body',
        data: {
            msg:'',
            addInputs: [{
                modal: ""
            }] ,
            select:{
                text: ''
            },selects: ''

        },
        methods: {
            save: function () {
                alert('欢迎' + this.msg);
            },
            addInput:function(){
                this.addInputs.push({
                    modal: ""
                })
            },
            removeInput:function(index) {
                this.addInputs.splice(index, 1)
            }
        }
    })
    
    
    
    其中这边的this.msg怎么读取不到输入框的动态数据呢

save: function () {

            alert('欢迎' + this.msg);
        }

---

不知道是不是这个原因， 但data应该是一个function返回一个object，或者问题出在父子间组件通讯上，父组件应该留一个接口给子组件更新父组件数据，msg是以参数的形式传递给子组件

---

组件内部的data需要建立匿名函数返回一个对象，vue文档里面着重说明

var MyComponent = Vue.extend({
  data: function () {
    return { a: 1 }
  }
})

参考下vue的文档：http://cn.vuejs.org/guide/com...

---

子组件v-model绑定的数据是子组件的data...

还有不用把一个input也搞成一个子组件。。。

如果非要你那样弄，你这样改吧：

var input=Vue.extend({
    props: {
        msg: String
    }
    template:'<input type="text" placeholder="请输入" v-model="msg"/>'
    });

然后<ui-input></ui-input>变成：<ui-input :msg.sync="msg"></ui-input>

具体请看文档http://cn.vuejs.org/guide/com...