首先是引入组件的页面 index.vue
<template>
<view>
<marquee-left :sendVal="marqueeL" sendt='传过来的文字'></marquee-left>
</view>
</template>
<script>
import uniMarqueeLeft from '@/h5Components/uni-marquee-left.vue';
export default {
data() {
return {
marqueeL:null
};
},
components:{
"marquee-left":uniMarqueeLeft,
},
created(){
//这里我 请求 后台 成功，为marqueeL赋值为一个数组
// 类似下面这个：
[{place: "来自南通市的", name: "陈女士"},
{place: "来自厦门市的", name: "赵先生"},
{place: "来自烟台市的", name: "韩先生"},
{place: "来自天津市的", name: "张先生"},
{place: "来自南昌市的", name: "孙女士"},
{place: "来自中山市的", name: "姜先生"},
{place: "来自兰州市的", name: "黄女士"},
{place: "来自石家庄市的", name: "周女士"},
{place: "来自珠海市的", name: "尤先生"}]
}
}
</script>
然后组件页面 h5Components ---> uni-marquee-left.vue
<template>
<view class="uni-list" v-for="(item,index) in sendVal" :key='index' ref='marqL'>
{{item.place}}<text class="uni-uname">{{item.name}}</text>
</view>
</template>
<script>
export default {
name:'uni-marquee-left',
props:{
sendVal:Array,
sendt:String
},
data() {
return {
}
},
created:function(){
console.log(this.sendVal) //在这里我就访问不了传过来的数组，就算是在mounted里面也访问不了。
console.log(this.sendt)
},
mounted(){
console.log(this.$refs) //这里为空对象，但是展开又有值。为什么都挂载好了，还是访问不了？？？
},
methods:{
}
}
</script>
问题：
- 在组件页面访问不了sendVal 的值，一直为null 。mounted生命周期也访问不了，然后this.$nextTick()也还是 访问不了，为什么？？？
- 但是如果sendVal的值 不是 通过请求获得，而是 本地的数据，那么就能获取到。为什么？？？
- 为什么除了array或者object类型的，都能在created 里面访问？？？
- 为什么 在mounted里面 访问this.$refs 是空对象，但是里面又有内容？？？不是都挂载好了吗
18 个回复
最佳回复
YUANRJ
在子组件的生命周期里，获取到的都是同步数据。如果是异步数据，需要自行监听数据变化，可以使用
watch或computed。snans
我也遇到这个问题，现在解决了。
当组件属性props类型为String、Number时在页面onLoad等生命周期中赋值正常，当类型为Array或Object时赋值失败
分析如下（具体原理还需高人指点）：
我的解决方案其实很简单：
点击参考《汇总一些遇到的奇奇怪怪的开发问题（vue3版本为主）》中标题为“自定义组件中json格式的props不能直接赋值给data(){}中的内部变量”的部分
1***@qq.com
2019-04-03 提的问你题，现在还有，什么破团队
z***@aliyun.com
我也是这个问题。写死的数据可以用。后台请求的就报错了
DreamWork
后台请求的数据，加载完毕之后才传入的，需要在组件中监听传入数据的变化
2019-06-18 17:01
降龙十八掌
回复 DreamWork: 求监听例子
2021-03-31 16:15
1***@qq.com
给 marqueeL赋值 的时候看看赋值的类型，多数是字符串型 JSON.parse()用这个方法转换成对象，应该就可以了
5***@qq.com
请问解决了吗？
7***@qq.com - awow
请问解决了吗？
井
我也遇到这个问题了，打印this，可以看到传过来的来props是有值的，但是打印props就打印不出来。感觉是个bug呢。
然后我watch监听props传过来的值，然后在监听事件里面赋值data值
w***@qq.com
我也是这个问题，最新版的HbuildX，props值传过来，但在子件中将该值无法赋值给其他值，赋值后显示所undefined
w***@163.com
在computed中可以拿到传过来得props
fjy1012
props里的数据申明如下，数据是数组类型时建议默认值申明用value,数组类型申明默认值用default会报错，其他数据类型如Object也有这样的问题。
1***@qq.com
props:{
list:{
type:Array,
default:()=>[]
}
},
2020-03-05 15:38
9***@qq.com
请问这个问题有解决吗？
yourbusiness
同求解答，通过 props 传递过来的父组件数据无法获取
3***@qq.com
只能将所有的props合并成一个对象传入
2020-02-27 13:32
8***@qq.com
大佬 怎么解决得
2020-03-13 16:33
8***@qq.com
大佬 解决没有
LiYaoHui
这个问题解决了没有？
2***@qq.com
:sendVal="marqueeL" sendt='传过来的文字'
这个参数sendVal的marqueeL为null,没有值;
这个也需要属性绑定 :sendt;
之所以没有在子组件获得参数,应该就是没有传值和没有属性绑定
u***@163.com
hhhh
刘翠 - 翠来
<template>
<view>
<!-- 我是子组件componentA -->
<view>{{normalizedSize}}</view>
</view>
</template>
刘翠
父子组件生命周期有顺序，created里拿不到，父组件onLoad里的内容
2023-11-29 16:14