数组绑定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

uniapp开发踩坑记录的更多相关文章

  1. uni-app开发踩坑记录

    大部分问题是我在h5端看不到而在android.iOS平台上暴露出来的,不包含小程序 1.:class="['defaultStyle', dynamicStyle]" 不支持直接 ...

  2. [转]微信小程序开发踩坑记录

    本文转自:http://www.cnblogs.com/NKnife/p/6283605.html 1.由于小程序wx.request()方法是异步的,在app.js执行ajax后,各分页加载app. ...

  3. 微信小程序开发踩坑记录

    1.由于小程序wx.request()方法是异步的,在app.js执行ajax后,各分页加载app.js的全局数据时,无法按顺序加载.例: //app.js App({ ajax:function() ...

  4. wepy开发踩坑记录

    与vue的不同 methods对象只存放tap等事件触发时的方法 events对象只存放$emit及$broadcast方法触发的事件 自定义方法及属性放在与methods平级的位置 props是动态 ...

  5. Spring开发踩坑记录

    #1 @EnableEurekaServer无法正常import原因是spring-cloud-dependencies版本太低,改成高版本的Edgware.SR4即可.参考:https://www. ...

  6. 你真的了解字典(Dictionary)吗? C# Memory Cache 踩坑记录 .net 泛型 结构化CSS设计思维 WinForm POST上传与后台接收 高效实用的.NET开源项目 .net 笔试面试总结(3) .net 笔试面试总结(2) 依赖注入 C# RSA 加密 C#与Java AES 加密解密

    你真的了解字典(Dictionary)吗?   从一道亲身经历的面试题说起 半年前,我参加我现在所在公司的面试,面试官给了一道题,说有一个Y形的链表,知道起始节点,找出交叉节点.为了便于描述,我把上面 ...

  7. ABP框架踩坑记录

    ABP框架踩坑记录 ASP.NET Boilerplate是一个专用于现代Web应用程序的通用应用程序框架. 它使用了你已经熟悉的工具,并根据它们实现最佳实践. 文章目录 使用MySQL 配置User ...

  8. SpringBoot+SpringSecurity+Thymeleaf认证失败返回错误信息踩坑记录

    Spring boot +Spring Security + Thymeleaf认证失败返回错误信息踩坑记录 步入8102年,现在企业开发追求快速,Springboot以多种优秀特性引领潮流,在众多使 ...

  9. IDFA踩坑记录

    IDFA踩坑记录: 1.iOS10.0 以下,即使打开“限制广告跟踪”,依然可以读取idfa: 2.打开“限制广告跟踪”,然后再关闭“限制广告跟踪”,idfa会改变: 3.越狱机器安装开发证书打的包, ...

随机推荐

  1. 优雅的实现多类型列表的Adapter

    1引言 在开发中经常会遇到,一个列表(RecyclerView)中有多种布局类型的情况.前段时间,看到了这篇文章 [译]关于 Android Adapter,你的实现方式可能一直都有问题(http:/ ...

  2. CSS 颜色 字体 背景 文本 边框 列表 display属性

    1  颜色属性 <div style="color:blueviolet">ppppp</div> <div style="color:#f ...

  3. ui-sref的参数传递

    例如:路由配置如下: $stateProvider.state('admin.userList', { url: '/listUser?type&role', //参数必须先在这边声明 tem ...

  4. 将Excel的数据导入DataGridView中(转)

    https://www.cnblogs.com/lhxhappy/archive/2008/11/26/1341873.html /// <summary> /// 点击按钮导入数据 // ...

  5. 关于nicescroll滚动条现在浏览器上滚动问题

    nativeparentscrolling: false //检测内容底部,并让父节点来滚动,作为原生滚动 有时候 当自定义滚动条在底部 滚动无效 可以把这个参数设置一下

  6. I/O复用及epoll基础知识

    IO multiplexing IO multiplexing这个词可能有点陌生,但是如果我说select,epoll,大概就都能明白了.有些地方也称这种IO方式为event driven IO.我们 ...

  7. 分布式ID生成器解决方案

    一.分布式系统带来ID生成挑战 在复杂的系统中,往往需要对大量的数据如订单,账户进行标识,以一个有意义的有序的序列号来作为全局唯一的ID; 而分布式系统中我们对ID生成器要求又有哪些呢? 全局唯一性: ...

  8. A B C D类网络地址

    A类网络地址(红色为网络地址,黑色为主机地址): 下限:0000 0001.0000 0000.0000 0000.0000 0000(1.0.0.0) 上限:0111 1110.1111 1111. ...

  9. 使用ASP.Net WebAPI构建REST服务——客户端

    原文的链接:http://www.cnblogs.com/TianFang/p/3724449.html WebAPI是标准的Http协议,支持Http协议的客户端(如浏览器)都可以访问.但是,有的时 ...

  10. DES加密(支持ARC与MRC)

    DES加密(支持ARC与MRC) 源文件: YXCrypto.h 与 YXCrypto.m // // YXCrypto.h // 用秘钥给字符串加密或者解密 // // Created by You ...