Vue2.0 propsData

来源:互联网 发布:卫卫网域名怎么备案 编辑:程序博客网 时间:2024/06/06 06:30

propsData 不是和属性有关,他用在全局扩展时进行传递数据。先回顾一下全局扩展的知识,作一个<header></header>的扩展标签出来。实际我们并非推荐用全局扩展的方式作自定义标签,我们学了组件,完全可以使用组件来做,这里只是为了演示propsData的用法。

  <header></header>

var fatherIsWho = Vue.extend({    template : `<p>{{question}}结果:{{answer}}</p>`,    data: function(){    return {    question : "你的爹地是谁?"    }    },    props:['answer']     })    new fatherIsWho({propsData:{'answer':'马云'}}).$mount('father')

扩展标签已经做好了,这时我们要在挂载时传递一个数字过去,我们就用到了propsData。

我们用propsData三步解决传值:

1、在全局扩展里加入propsData进行传递。propsData:{'answer':'马云'}

2、传递时用props进行接受。props:[‘answer’]

3、用插值的形式写入模板。{{ answer }}

总结:propsData在实际开发中我们使用的并不多,我们在后边会学到Vuex的应用,他的作用就是在单页应用中保持状态和数据的。
原创粉丝点击