v-for循环中的question组件，通过props传给子组件值时，子组件接受不到值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>自定义指令</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<script src="js/flexible.js"></script>
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div id="app">
<div class="questions">
<div v-for="(item,index) in qtArr">
<question :qtObj="item"></question>
</div>
</div>
<script src="js/vue.min.js"></script>
<script>
//question component
Vue.component('question', {
props:{
qtObj:{
type:String,
required:true
}
},
template:` `,
data() {
return {
dataObj:this.qtObj
}
},
mounted(){
console.log(this.qtObj);//打印出来一直是undefined 请大神指教
}
})
var app =new Vue({
el:'#app',
data: {
page:1,
qtArr: [
{
num:1,
type:'radio',
title:'请问你的性别是？',
options: ["男","女"],
name:'sex',
},
{
num:2,
type:'checkbox',
title:'你喜欢的水果有哪些？',
options: ["apple","pear","banner","strawberry "],
name:'Fruit'
},
{
num:3,
type:'text',
title:'简单介绍一下你自己吧!',
options: [],
name:'intro'
}
],
},
})
</script>
</body>
</html>
网友评论