数组绑定class的问题

自定义了一个icon的组件,部分代码如下

<template>
	<text :class="[name, icon]"
		:style="{'color': color, 'font-size': fontSize}">
	</text>
</template>

<script>
	export default {
		props: {
			name: {
				type: String,
				default: 'iconfont'
			},
			icon: {
				type: String
			},
			color: {
				type: String,
				default: '#666666'
			},
			size: {
				type: [Number, String],
				default: 30
			}
		},
		computed: {
			cls(){
				return `${this.name} ${this.icon}`
			},
			fontSize(){
				return this.size + 'upx'
			}
		}
	}
</script>

使用

<lb-icon icon="icon-message"></lb-icon>

H5端显示正常无异常,模拟器模拟显示class之间多了逗号,如图所示
在这里插入图片描述
解决方法
利用computed进行class拼接

<text :class="cls"
	:style="{'color': color, 'font-size': fontSize}">
</text>
computed: {
	cls(){
		return `${this.name} ${this.icon}`
	}
}

Vuex mapGetters问题

版本:v1.5.4
正常使用mapGetters的时候,H5端无异常,非H5端会报错

TypeError: Cannot read property 'getters' of undefined

main.js中增加Vue.prototype.$store = store
在这里插入图片描述

Logo

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

更多推荐