可恶,我用了开发h5思维去开发小程序

1、插槽加了 slot-scope 就不显示??什么情况

<orderCard :orderInfo="orderInfo">
   <template v-if="show">
        <view slot="name1"  slot-scope="slotProps">
           <text>时间</text>
           <text>{{ slotProps.time }}</text>
        </view>
        <view slot="name2"  slot-scope="slotProps2">
           <text>时间</text>
           <text>{{ slotProps2.time2 }}</text>
        </view>
   </template>
</orderCard>

发现这样写,插槽是不会显示的,

原因是包裹 slot 必须直接作为 组件 的子节点,不能被 template 包裹,否则微信小程序端 slot 机制会失效。slot 必须直接作为自定义组件的子节点,不能被 template/v-if 包裹。
修正后写法:

<orderCard :orderInfo="orderInfo">

        <view v-if="show" slot="name1"  slot-scope="slotProps">
           <text>时间</text>
           <text>{{ slotProps.time }}</text>
        </view>
        <view v-if="show" slot="name2"  slot-scope="slotProps2">
           <text>时间</text>
           <text>{{ slotProps2.time2 }}</text>
        </view>

</orderCard>

这样就可以显示啦

2、 引入了组件,但是不显示?

我创建了一个混入mixin文件,我在里面引入了组件,h5思维:复用吗,引入组件也复用

import hhzj from "@/component/hhzj";

export default {
    mixins: [hhzj],
}

在把这个mixin文件 引入到我们的页面使用,居然发现不能正常显示,我在组件使用下面munted打印输入,发现开发工具控制台没有输出,证明没有挂载成功,后面才知道,开发小程序用混入里面引入组件不行

mounted() {
    console.log('挂载了')
},

Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐