数组绑定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. 润乾报表html代码填报

     由于html和富文本类型的单元格,不能进行可写操作,如果要想填报时填入html代码并且提交后更新就要换了一个方法,通过数据回填的方法. 比如在C3单元格设置html事件(也可以通过一个按钮来触发 ...

  2. Weblogic集群配置__部署润乾应用

     ◆环境: Windows xp Weblogic:wls1031_ccjk_win32.rar(内部下载:\\192.168.0.38\SystemInstaller\4WebServer\we ...

  3. Condition使用

    面试题:写一个固定容量同步容器,拥有put和get方法,以及getCount方法,    能够支持2个生产者线程以及10个消费者线程的阻塞调用 有两种方法 1.使用wait和notify/notify ...

  4. linux 挂载命令mount、umount

    mount /bin/mount语法:mount [-t文件系统] 设备文件名 挂载点mount -t iso9660 /dev/sr0 /mnt/cdromiso9660是固定的,光盘:所以 -t ...

  5. 八、Web移动端Fixed布局的解决方案

    移动端业务开发,iOS 下经常会有 fixed 元素和输入框(input 元素)同时存在的情况. 但是 fixed 元素在有软键盘唤起的情况下,会出现许多莫名其妙的问题. 这篇文章里就提供一个简单的有 ...

  6. Mysql中的delimiter详解

    初学mysql时,可能不太明白delimiter的真正用途,delimiter在mysql很多地方出现,比如存储过程.触发器.函数等. 学过oracle的人,再来学mysql就会感到很奇怪,百思不得其 ...

  7. springboot学习入门之五---开发Web应用之JSP篇

    转载:http://tengj.top/2017/03/13/springboot5/ 1整体结构 整体的框架结构,跟前面介绍Thymeleaf的时候差不多,只是多了webapp这个用来存放jsp的目 ...

  8. ansible 一键部署

    start install: rpm   -Uvh   https://mirrors.aliyun.com/epel/epel-release-latest-7.noarch.rpm yum  in ...

  9. Oracle EBS AR 更新客户组织层

    declare -- Local variables here i integer; g_module ) := 'TCA_V2_API'; lrec_org hz_party_v2pub.organ ...

  10. Oracle EBS 创建资产报错

    Solution:设置资产弹性域 随便输入一个值 再冻结