常见问题汇总(完善中……)
在跨端框架中使用Lin-UI
lin-ui支持在uni-app、mpvue、Taro等跨端框架中使用。
注意
当在跨端框架中引用lin-ui后,将只能编译为微信小程序
组件List常见问题
1 、在使用List组件时,有时我们需要去掉List默认的右侧箭头,通过阅读文档找到配置项is-link
,需要注意的是is-link
的数据类型Boolean
。通常会有错误写法如下:
<l-list icon="notification" title="铃声" is-link="false"/>
正确写法:
<l-list icon="notification" title="铃声" is-link="{{false}}"/>
原因:在小程序中如果写成is-link="false"
,此时false
数据类型并不是Boolean
,而是String
,这也是小程序中一个比较常见的问题。更加值得注意的是如果写成下面这种写法也是可以达到预期的效果。
<l-list icon="notification" title="铃声" is-link="{{xxx}}"/>
or
<l-list icon="notification" title="铃声" is-link="{{0}}"/>
但是如果is-link="1"
等价于is-link="true"
<l-list icon="notification" title="铃声" is-link="{{1}}"/>
关于在小程序中将less编译成wxss
在开发小程序的过程中,或许很多人还在用wxss
写小程序的层叠样式表,或许曾经尝试过将less
编译成wxss
。但是每次写完less
都需要手动编译,效率真的是太低了,用wxss
写样式,也不够优雅,那么我们就需要一个技术去同步将less
编译成wxss
。
这里介绍下wxss-cli,这是一个可以实时将less
变成wxss
的插件。
使用方法: 1 、首先全局安装wxss-cli
npm install -g wxss-cli
2 、查看是否安装完毕
wxss -V
3 、使用wxss-cli
wxss ./minicode
友情提醒
minicode 为小程序开发根目录
4 、运行wxss-cli,如果出现类似以下提示,则wxss-cli运行成功!
wxss is running...
Add pages/books/index.less success!
Add pages/index/index.less success!
关于自定义iconfont与lin-ui内置的iconfont相冲突的问题
在实际项目,lin-ui
现在所提供的icon
可能还不能满足需求,我们往往会通过iconfont
为项目添加自定义的icon
。在添加icon
的时候,往往会出现自定义的iconfont
库中的content
属性与lin-ui
内置iconfont
的content
的值一样。
解决思路有以下两种:
1 、在自定义的项目中修改iconfont
的content
属性。但是,如果自定义图标过多,那么造成冲突的概率就会大大提升,不建议这样解决冲突。
2 、在项目中添加iconfont
时,把font-family
改成自定义的值,只要不是iconfont
就可以。
<l-icon name="my-icon" l-class="icon-self"/>
.icon-self{
font-family:my-icon !important;
}
友情提醒
my-icon 为你自定义的font-family值