nutui
nutui copied to clipboard
jdf2e
picker在官网例子中没有渲染出选择项
NutUI 包名
@nutui/nutui
NutUI 版本号
4.1.3
平台
weapp
重现链接
https://gitee.com/frankchou1/taro-template/blob/master/src/components/ProForm/fields/select-field/picker/index.vue
重现步骤
先贴一下官网的示例代码：
<template>
<nut-cell title="请选择城市" :desc="popupDesc" @click="show = true"></nut-cell>
<nut-popup position="bottom" v-model:visible="show">
<nut-picker v-model="popupValue" :columns="columns" title="请选择城市" @confirm="popupConfirm" @cancel="show=false">
<nut-button block type="primary">永远有效</nut-button>
</nut-picker>
</nut-popup>
</template>
<script lang="ts">
import { ref } from 'vue';
export default {
setup(props) {
const show = ref(false);
const popupDesc = ref();
const popupValue = ref();
const columns = ref([
{ text: '南京市', value: 'NanJing' },
{ text: '无锡市', value: 'WuXi' },
{ text: '海北藏族自治区', value: 'ZangZu' },
{ text: '北京市', value: 'BeiJing' },
{ text: '连云港市', value: 'LianYunGang' },
{ text: '浙江市', value: 'ZheJiang' },
{ text: '江苏市', value: 'JiangSu' }
]);
const popupConfirm = ({ selectedValue, selectedOptions }) => {
popupDesc.value = selectedOptions.map((val: any) => val.text).join(',');
show.value = false;
};
return { show, popupDesc, columns, confirm, popupConfirm, popupValue };
}
};
</script>
这例子中用nut-popup包裹nut-picker, 但picker中代码块（view）没有渲染出来（https://github.com/jdf2e/nutui/blob/977a8054e51671e5f93953aad097057da7b089f9/src/packages/__VUE/picker/index.taro.vue#L31）。
我测试了一下，有两种方式可以让他正常渲染，但具体原因还没找到
- 把上面代码块中的view改为text。
- nut-popup直接包裹picker中的picker-view（组件内不用view包裹）
应该是taro组件的问题，但不确定，毕竟他们给的例子能正常跑
期望的结果是什么？
正常显示
实际的结果是什么？
没有渲染子项
环境信息
Taro CLI 3.6.11 environment info:
System:
OS: Windows 10 10.0.19044
Binaries:
Node: 20.2.0 - D:\SofeWare\node\node.EXE
npm: 8.1.0 - D:\SofeWare\node\npm.CMD
npmPackages:
@tarojs/cli: 3.6.11 => 3.6.11
@tarojs/components: 3.6.11 => 3.6.11
@tarojs/helper: 3.6.11 => 3.6.11
@tarojs/plugin-framework-vue3: 3.6.11 => 3.6.11
@tarojs/plugin-html: ^3.6.12 => 3.6.12
@tarojs/plugin-platform-alipay: 3.6.11 => 3.6.11
@tarojs/plugin-platform-h5: 3.6.11 => 3.6.11
@tarojs/plugin-platform-jd: 3.6.11 => 3.6.11
@tarojs/plugin-platform-qq: 3.6.11 => 3.6.11
@tarojs/plugin-platform-swan: 3.6.11 => 3.6.11
@tarojs/plugin-platform-tt: 3.6.11 => 3.6.11
@tarojs/plugin-platform-weapp: 3.6.11 => 3.6.11
@tarojs/plugin-vue-devtools: 3.6.11 => 3.6.11
@tarojs/runtime: 3.6.11 => 3.6.11
@tarojs/shared: 3.6.11 => 3.6.11
@tarojs/taro: 3.6.11 => 3.6.11
@tarojs/taro-loader: 3.6.11 => 3.6.11
@tarojs/webpack5-runner: 3.6.11 => 3.6.11
babel-preset-taro: 3.6.11 => 3.6.11
eslint-config-taro: 3.6.11 => 3.6.11
其他补充信息
No response
其他组件的问题也带一下，
- nut-input组件无论用onChange、onBlur、onUpdate:modal-value事件，都会在失去焦点的时候清空输入的内容
在 Taro3.6.11 + NutUI 4.1.3 创建的新项目中，直接使用 Picker 示例无法复现问题。 复现仓库中，将 Picker 稍微调整到更高层级时，就能正常显示 picker-view-column。 可能是由于封装层级过多导致的问题。 而且微信小程序并不支持递归调用模板：Taro 模板
在 Taro3.6.11 + NutUI 4.1.3 创建的新项目中，直接使用 Picker 示例无法复现问题。 复现仓库中，将 Picker 稍微调整到更高层级时，就能正常显示 picker-view-column。 可能是由于封装层级过多导致的问题。 而且微信小程序并不支持递归调用模板：Taro 模板
那封装层级过多以及不支持递归模板这两个问题会有哪些解决方案？
在 Taro3.6.11 + NutUI 4.1.3 创建的新项目中，直接使用 Picker 示例无法复现问题。 复现仓库中，将 Picker 稍微调整到更高层级时，就能正常显示 picker-view-column。 可能是由于封装层级过多导致的问题。 而且微信小程序并不支持递归调用模板：Taro 模板
我也遇到了这个问题，taro3.4.14 nutui4.1.5 什么叫将picker调整到更高层级，不是很明白。 目前我就是nut-popup包裹nut-picker 小程序报./base.wxml Template tmpl_0_picker-view not found. 要怎么解决才行呢？ 谢谢
在 Taro3.6.11 + NutUI 4.1.3 创建的新项目中，直接使用 Picker 示例无法复现问题。 复现仓库中，将 Picker 稍微调整到更高层级时，就能正常显示 picker-view-column。 可能是由于封装层级过多导致的问题。 而且微信小程序并不支持递归调用模板：Taro 模板
那封装层级过多以及不支持递归模板这两个问题会有哪些解决方案？
我也遇到了这个问题，taro3.4.14 nutui4.1.5 什么叫将picker调整到更高层级，不是很明白。 目前我就是nut-popup包裹nut-picker 小程序报./base.wxml Template tmpl_0_picker-view not found. 要怎么解决才行呢？ 谢谢
