<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="./css/weui.css" rel="stylesheet">
<script type="text/javascript" src="./js/vue.js"></script>
</head>
<body>
<template id="parentVal">
<p>
<p>{{hyname}}</p>
<child :zj-name="hyname"></child>
</p>
</template>
<template id="childVal">
<p>{{zj-name}}</p>
<p></p>
<input></input>
</template>
<p id="parentChild">
<span>{{uiname}}</span>
<parent v-bind:name="uiname"></parent>
</p>
<script type="text/javascript">
var childVal = Vue.extend({
template:'#childVal'
});
Vue.component(
"parent",
{
data:function(){
return {
hyname:"120"
}
},
template:'#parentVal',
components:{
props:['zjName'],
'child':childVal,
data:function(){
return{
zjName:"io"
}
}
},
ready:function(){
console.log(this)
}
}
)
new Vue({
el:'#parentChild',
data:{
uiname:'hj'
}
})
</script>
</body>
</html>
我这样运行结果是子组件<p>{{hyname}}</p>为NAN,控制套提示[Vue warn]: Attribute ":zj-name" is ignored on component <child> because the component is a fragment instance: http://vuejs.org/guide/compon...,,难道是我props用的不对?代码可能有点乱,抱歉。谢谢各位帮忙说下是不是错的很离谱。
写法有问题,把
放到上面
变成
还有就是你已经在data里定义了zjName,应该换个名称