vue17-子元件定義data屬性
阿新 • • 發佈：2018-12-11
看下面程式碼：
<!DOCTYPE html> <html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js"></script> </head> <body> <div id="root"> <table> <tbody> <tr is="row"></tr> <tr is="row"></tr> <tr is="row"></tr> </tbody> </table> </div> <script> Vue.component("row",{ data:{ content:'this is a row' }, template:'<tr><td>{{content}}</td></tr>' }) var vm = new Vue({ el:"#root" }) </script> </body> </html>
控制檯會顯示如下錯誤：data應該是一個function,返回一個例項值
data改成這樣定義：子元件中data應該是一個function,然後返回一個例項值
data: function(){
return {
content: 'this is a row'
}
},可以這樣定義多個：
return { content: 'this is a row', name:'xuhaixing' }