uniapp开发踩坑记录

数组绑定class的问题

版本：v1.5.4
自定义了一个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