a***@qq.com
a***@qq.com
  • 发布:2024-08-05 13:51
  • 更新:2025-02-20 13:09
  • 阅读:207

【报Bug】插槽同时使用动态命名和自定义属性传参时编译成微信小程序会报错

分类:uni-app

产品分类: uniapp/小程序/微信

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 23H2

HBuilderX类型: 正式

HBuilderX版本号: 4.24

第三方开发者工具版本号: 1.06.2402040

基础库版本号: 3.3.0

项目创建方式: HBuilderX

操作步骤:
<slot name="tab:{{item.prop}}" :row="item"></slot>

插槽中使用动态插槽名称加上自定义参数时编译为小程序会报错

预期结果:

正常运行

实际结果:
[ WXML 文件编译错误] ./components/Query/query.wxml  
unexpected character `{`  
> 1 | <uv-popup vue-id="0b982d90-1" mode="right" customStyle="  overflow-y: auto;" data-ref="popup" data-event-opts="{{[['^change',[['change']]]]}}" bind:change="__e" class="data-v-2048cb94 vue-ref" bind:__l="__l" vue-slots="{{['default']}}"><view class="popup-main data-v-2048cb94"><view class="form data-v-2048cb94"><block wx:if="{{value}}"><uv-form vue-id="{{('0b982d90-2')+','+('0b982d90-1')}}" labelPosition="left" model="{{searchForm}}" data-ref="componentsForm" class="data-v-2048cb94 vue-ref" bind:__l="__l" vue-slots="{{['default']}}"><block wx:for="{{$root.l0}}" wx:for-item="item" wx:for-index="__i0__"><block wx:if="{{item.$orig.query}}"><block wx:if="{{item.$orig.slotScope}}"><slot name="tab:{{item.prop}}"></slot><scoped-slots-tab:{{item.prop}} row="{{item.$orig}}" class="scoped-ref" bind:__l="__l"></scoped-slots-tab:{{item.prop}}></block><block wx:else><block wx:if="{{item.g0}}"><uv-form-item vue-id="{{('0b982d90-'+__i0__)+','+('0b982d90-2')}}" label="{{item.$orig.label}}" prop="{{item.$orig.prop}}" labelPosition="top" class="data-v-2048cb94" bind:__l="__l" vue-slots="{{['default']}}"><uv-input bind:input="__e" vue-id="{{('0b982d90-'+__i0__)+','+('0b982d90-'+__i0__)}}" placeholder="{{item.$orig.placeholder||'请输入'+item.$orig.label}}" border="bottom" clearable="{{true}}" value="{{searchForm[item.$orig.prop]}}" data-event-opts="{{[['^input',[['__set_model',['$0','$1','$event',[]],['searchForm',[['columns','',__i0__,'prop']]]]]]]}}" class="data-v-2048cb94" bind:__l="__l"></uv-input></uv-form-item></block><block wx:else><block wx:if="{{item.$orig.action}}"></block><block wx:else><block wx:if="{{item.$orig.type==='upload'}}"></block><block wx:else><block wx:if="{{item.$orig.type==='location'}}"></block></block></block></block></block></block></block><uv-button vue-id="{{('0b982d90-5')+','+('0b982d90-2')}}" text="查询" customStyle="margin-top: 10px" color="#7CD255" data-event-opts="{{[['^click',[['submit']]]]}}" bind:click="__e" class="data-v-2048cb94" bind:__l="__l"></uv-button><uv-button vue-id="{{('0b982d90-6')+','+('0b982d90-2')}}" type="error" text="重置" customStyle="margin-top: 10px" data-event-opts="{{[['^click',[['reset']]]]}}" bind:click="__e" class="data-v-2048cb94" bind:__l="__l"></uv-button><uv-button vue-id="{{('0b982d90-7')+','+('0b982d90-2')}}" text="关闭" customStyle="margin-top: 10px" data-event-opts="{{[['^click',[['closeDrawer']]]]}}" bind:click="__e" class="data-v-2048cb94" bind:__l="__l"></uv-button></uv-form></block></view></view></uv-popup>  
    |                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    ^  
at files://components/Query/query.wxml#1(env: Windows,mp,1.06.2402040; lib: 3.3.0)

bug描述:

<slot name="tab:{{item.prop}}" :row="item"></slot>

插槽中使用动态插槽名称加上自定义参数时编译为小程序会报错

2024-08-05 13:51 负责人:BFC 分享
已邀请:
蔡cai

蔡cai

<slot :name="`tab${item.prop}`" :row="item"></slot>
你要的是这种效果吧?tab+item.prop

  • a***@qq.com (作者)

    谢谢,不过这个是H5的语法编译成小程序的话会报错

    2024-08-05 14:05

  • 蔡cai

    回复 a***@qq.com: 我试了下好像正常

    2024-08-05 15:13

  • 蔡cai

    回复 a***@qq.com:

    子组件:<slot :name="tab${test}"></slot>


    父组件:

    <child test="2">

    <template v-slot:tab2>

    tab2tab2tab2tab2

    </template>

    </child>

    2024-08-05 15:15

  • a***@qq.com (作者)

    回复 蔡cai: 子组件再加一个 :test="123" 之类的试试, 问题就在于不能同时使用,如果同时使用后编译成小程序就会报错

    2024-08-05 15:54

  • 蔡cai

    回复 a***@qq.com: 这个传的是数组吧,应该不是再传一个123吧

    2024-08-05 16:16

  • 1***@qq.com

    回复 a***@qq.com: 有解决吗?我也有遇到这个问题

    2024-11-21 14:10

2***@qq.com

2***@qq.com

怎么解决的

要回复问题请先登录注册