相关平台

微信小程序

小程序基础库: 2.14.4
使用框架: Vue 3

复现步骤

<template>
  <view class="index">
    <view>
      <img src="" alt="">
    </view>
    {{ msg }}
    <view class="btn">
      <nut-button type="primary" @click="handleClick('text', msg2, true)">点我</nut-button>
      <component :is="testButton">aaaa</component>

      <template v-for="comp in customComponents">
        <component :is="comp.type">aaaa</component>
      </template>
    </view>
    <nut-toast :msg="msg" v-model:visible="show" :type="type" :cover="cover" />
  </view>
</template>

<script>
import { reactive, ref, toRefs } from 'vue';
export default {
  name: 'Index',
  components: {
    
  },
  setup(){
    const state = reactive({
      msg: '欢迎使用 NutUI3.0 开发小程序',
      msg2: '你成功了～',
      type: 'text',
      show: false,
      cover: false
    });

    const testButton = ref('nut-button')

    let customComponents = reactive([
      {type: 'nut-buttton', label: '按钮1'},
      {type: 'nut-buttton', label: '按钮2'},
    ])

    const handleClick = (type, msg, cover = false) => {
      state.show = true;
      state.msg2 = msg;
      state.type = type;
      state.cover = cover;
    };

    return {
      ...toRefs(state),
      testButton,
      customComponents,
      handleClick
    }
  }
}
</script>

期望结果

动态组件能正常渲染

实际结果

报错：

Template `tmpl_0_nut-buttton` not found.
  347 | 
  348 | <template name="tmpl_2_container">
> 349 |   <template is="{{xs.a(2, i.nn, l)}}" data="{{i:i,cid:2,l:xs.f(l,i.nn)}}" />
      |                ^
  350 | </template>
  351 | 
  352 | <template name="tmpl_3_catch-view">

环境信息

Taro v3.4.3

  Taro CLI 3.4.3 environment info:
    System:
      OS: Windows 10
    Binaries:
      Node: 16.13.0 - C:\Program Files\nodejs\node.EXE        
      Yarn: 1.22.17 - C:\Users\jc\AppData\Roaming\npm\yarn.CMD
      npm: 8.1.0 - C:\Program Files\nodejs\npm.CMD