-
不寫的話，腳手架工具會自動幫你搜尋以.vue結尾的文件
查看全部 -
npm run dev
啟動 webpack-dev-server
查看全部 -
父组件给子组件传值，父组件通过:content="item"属性给子组件传值
子组件通过export default{}里的props:['content']接收父组件的传值。
查看全部 -
引用组价
import Td from './components/toitem'
注册组件
components：{
'to-do':Td
}
查看全部 -
vue-cli组件里data不用对象的方式，而是用函数的方式返回数据。
查看全部 -
模板template的最外层只能有一个包裹原酸div
查看全部 -
每一個組件也是一個vue的實例。
每一個項目都是由很多個組件組成的，也就是很多個vue實例組成的，因為每個組件就是vue實例，所以在組件中可以正常使用vue的一些方法，比如methods,watch等等。每個組件都擁有自己的props、data、methods等等
每一個組件都有一個template模板，如果沒有寫template，默認為掛載點下面的所有DOM標籤作為模板。查看全部 -
课程代码演示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Vue</title> <script src="./vue.js"></script> </head> <body> <div id="root"> <div> <input v-model="inputValue"/> <button @click="handleClick">提交</button> </div> <ul> <todo-item v-for="(item,index) of list" :key="item" :content="item" ></todo-item> </ul> </div> <script> Vue.component('todo-item',{ props:['content'], template:'<li>{{content}}</li>' }) // var TodoItem={ // template:'<li>item</li>' // } new Vue({ el:"#root", data:{ inputValue:"hello", list:[] }, methods:{ handleClick:function(){ this.list.push(this.inputValue); this.inputValue=""; } } }) </script> </body> </html>我們可以把一個較大的項目拆分成一個個小的組件，這樣維護起來就比較方便了全局組件：vue提供了vue.component()來定義組件，第一個參數是組件的名字，也是我們將要寫在dom裡的標籤，第二個參數是一個對象，裡面可以定義一個模板，也是我們要顯示的內容。
局部組件，在外面定義一個對象，對象裡面裝著模板，但是這樣還不可直接使用，我們需要在實例裡面進行註冊，配置標籤名和內容。意思就是在我這個vue實例裡面去使用這個組件。
組件傳參，在標籤裡面定義屬性，屬性就是我們想要顯示的內容然後在組件裡面用props(固定)給接收過來就可以正常使用了。查看全部 -
属性绑定 v_bind或 : 双向绑定 v_model查看全部
-
可以这么理解，data里面的数据，如果是在标签属性里，就不用双花括号数据绑定，如果是在页面显示，那就需要数据绑定。
查看全部 -
这里v-bind才能让title和下面vue实例的title绑定，而不是双花括号，为什么嗯
查看全部 -
注意看这里this的意思是data下的
查看全部 -
模板就是挂载点内部的内容
查看全部 -
父子组件通过属性传值
查看全部 -
父组件通过属性的形式给子组件传递参数
查看全部
举报