vue3 使用uni-data-picker 在小程序中,localdata数据不展示
- 发布:2023-04-04 10:59
- 更新:2023-07-11 15:52
- 阅读:2338
vue3 使用uni-data-picker 在小程序中,localdata数据不展示
localdata 不支持数组类型的数据,而 Uni-Data-Picker 中的 data 组件是以数组形式进行展示的,所以才导致了 localdata 数据不展示的问题。
解决:把数组类型的数据转换成字符串类型的数据,然后再进行传递
注意说明:1.localdata 中的数据是否是一个数组,且每个元素都是一个对象,对象中需要包含 name 和 value 两个属性,如下所示:
[
{ name: '选项1', value: 'option1' },
{ name: '选项2', value: 'option2' },
{ name: '选项3', value: 'option3' },
]
2.localdata 中的数据是否正确,可以在控制台打印出来检查一下。
3.确认 uni-data-picker 组件的属性是否正确设置,包括 localdata、default-index、title 等属性。
<template>
<view class="content">
<view class="text-area">
<uni-data-picker :localdata="items" popup-title="请选择班级" @change="onchange"
@nodeclick="onnodeclick"></uni-data-picker>
</view>
</view>
</template>
<script>
export default {
data() {
return {
items: [{
text: "一年级",
value: "1-0",
children: [{
text: "1.1班",
value: "1-1"
},
{
text: "1.2班",
value: "1-2"
}
]
},
{
text: "二年级",
value: "2-0"
},
{
text: "三年级",
value: "3-0"
}
]
}
},
methods: {
onchange(e) {
const value = e.detail.value
},
onnodeclick(node) {}
}
}
</script>
-
2***@qq.com (作者)
好像确实npm下载里面代码的问题,我把通过hb下载的uni_modules里面的uni-data-picker 组件拷贝过去覆盖就展示出来了
2023-04-04 14:40
2***@qq.com (作者)
我按照的你们案列来的呀
2023-04-04 11:22