首页 > javascript > 【家有账本】小程序开发系列(2)–有赞 zanui 组件扩展属性

【家有账本】小程序开发系列(2)–有赞 zanui 组件扩展属性

虽然我前端水平还不错,但是我是很厌恶写html+css代码的,只好到github上去找开源组件,还找到了一个很不错的ui组件,虽然不是很完整,但总比没有强

地址: https://github.com/youzan/zanui-weapp

虽然样子不错,但是功能还是达不到我的预期,由于原来组件 不带自定义class,就无法做到自定义颜色,所以决定修改源码 加入自定义字段,最终效果如下

效果

【家有账本】小程序开发系列(2)--有赞 zanui 组件扩展属性 - 第1张  | 博客一个

修改源码

我用到的是cell组件,所以要打开cell组件目录

首先打开组件的 js 文件 index.js 插入自定义字段,接着打开 index.wxss 加入自定义样式,最后打开组件的 index.wxml 文件调整渲染条件, 大功告成。现在就可以了在项目中为所欲为了

【家有账本】小程序开发系列(2)--有赞 zanui 组件扩展属性 - 第2张  | 博客一个

【家有账本】小程序开发系列(2)--有赞 zanui 组件扩展属性 - 第3张  | 博客一个

【家有账本】小程序开发系列(2)--有赞 zanui 组件扩展属性 - 第4张  | 博客一个

调用方法

【家有账本】小程序开发系列(2)--有赞 zanui 组件扩展属性 - 第5张  | 博客一个

举一反三 ,这就可以扩展任何组件了