17、propsData

---

propsData 不是和属性有关，它用在全局扩展时进行传递数据。 类型：{ [key: string]: any }。 限制：只用于 new 创建的实例中。 详细:创建实例时传递 props。主要作用是方便测试。首先这个使用率并不高，因为后面会有vuex,他的作用就是单页面应用中保持状态和数据的，本机就是在全局扩展里面传递参数propsData。 举例：

<div id="app">
    </div>
    <template id="eg">
        <div>
            <h5>这个是使用extend创建出来的组件</h5>
        </div>
    </template>
    <script src="./Vuejs/vue2-6-12.js"></script>
    <script>
        // 通过extend扩展一个新的组件
        var myextend = Vue.extend({
            template:"#eg"
        })
        // 实例化对象
        new myextend().$mount("#app");
    </script>

我们可以看到这是使用extend方法创建组件，但是在使用这个方法的时候，我们是不容易传递数据的，因此这里引入了propsData。
举例：使用propsData：

 <div id="app">
    </div>
    <template id="eg">
        <div>
            <h5>这个是使用extend创建出来的组件</h5>
            <h6>{{news}}</h6>
        </div>
    </template>
    <script src="./Vuejs/vue2-6-12.js"></script>
    <script>
        // 通过extend扩展一个新的组件
        var myextend = Vue.extend({
            template:"#eg",
            props:['news']//需要通过props来接收，接收的名称得和propsData的key相同
        })
        // 实例化对象
        new myextend({propsData:{news:"这个就是propsData传递的数据"}}).$mount("#app");
    </script>