详细问题描述
组件不编译,用的构造函数 抛出的值也完善
[内容]
<template>
<div class="content">
<uni-badge type="purple" text="123" />
</div>
</template>
<script>
import { basepage } from '../basepage'
import uniBadge from '@/components/uni-badge/uni-badge.vue'
import Vue from 'vue'
class VuePage {
mixins = [basepage]
data = {
title: 'Hello',
productList: []
}
components = {
// xkdIcon,
uniBadge
}
async bindApiData(option) {
}
methods = {}
}
export default Vue.ClassToVueOptions(new VuePage(), VuePage.prototype)
</script>
<style style='less' scoped>
</style>
[步骤]
使用这种方式编译成抖音小程序组件无法编译出来
[结果]
export default抛出的数据结构如图1
组件渲染出来如图2 图3 图4
[期望]
和 hello uniapp的案例一样 自定义组件这样写能正常编译代码
uni-app运行环境说明
[运行端是h5或app或某个小程序?]
抖音小程序
[运行端版本号]
[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]
cli创建
[编译模式是老模板模式还是新的自定义组件模式?]
新的自定义组件模式
附件
[可重现代码片段]
<template>
<div class="content">
<uni-badge type="purple" text="123" />
</div>
</template>
<script>
import { basepage } from '../basepage'
import uniBadge from '@/components/uni-badge/uni-badge.vue'
import Vue from 'vue'
class VuePage {
mixins = [basepage]
data = {
title: 'Hello',
productList: []
}
components = {
// xkdIcon,
uniBadge
}
async bindApiData(option) {
}
methods = {}
}
export default Vue.ClassToVueOptions(new VuePage(), VuePage.prototype)
</script>
<style style='less' scoped>
</style>
备注 : uniBadge 为官方Ui
联系方式
[QQ] 544177047