小程序之基础样式库WeUI有什么用-创新互联-成都快上网建站

小程序之基础样式库WeUI有什么用-创新互联

小编给大家分享一下小程序之基础样式库WeUI有什么用，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

成都创新互联专业为企业提供运城网站建设、运城做网站、运城网站设计、运城网站制作等企业网站建设、网页设计与制作、运城企业网站模板建站服务，十载运城做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。

TODO：小程序集成WeUI

WeUI 为微信 Web 服务量身设计。WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信 Web 开发量身设计，可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。

1.使用微信开发者工具添加新项目MWL

小程序之基础样式库WeUI有什么用

2.下载WeUI的源码，把style文件拷贝到MWL根目录，与pages文件夹同一级

3.WXSS(WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式。

小程序之基础样式库WeUI有什么用

WXSS 用来决定 WXML 的组件应该怎么显示。
为了适应广大的前端开发者，我们的 WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序，我们对 CSS 进行了扩充以及修改。
与 CSS 相比我们扩展的特性有：
尺寸单位
样式导入

4.在app.wxss导入样式，使用@import语句可以导入外联样式表，@import后跟需要导入的外联样式表的相对路径，用;表示语句结束。

小程序之基础样式库WeUI有什么用

定义在 app.wxss 中的样式为全局样式，作用于每一个页面。在 page 的 wxss 文件中定义的样式为局部样式，只作用在对应的页面，并会覆盖 app.wxss 中相同的选择器。

5.WXML（WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。

a)数据绑定

小程序之基础样式库WeUI有什么用

b)条件渲染

小程序之基础样式库WeUI有什么用

c)事件，关键参数是bindtap

小程序之基础样式库WeUI有什么用

6.组件，都包含在容器view里面，组件结合WeUI使用，构建出统一，美观都界面。

小程序之基础样式库WeUI有什么用

7.示例1，导航都标题是设置在*.json里面的 navigationBarTitleText，在app.json设置的参数是全局可使用，定义在page的json是局部页面可以使用。以此类推*.js也是有全局和局部之分。

小程序之基础样式库WeUI有什么用

代码：

小程序之基础样式库WeUI有什么用

以上是“小程序之基础样式库WeUI有什么用”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！

文章名称：小程序之基础样式库WeUI有什么用-创新互联
文章网址：http://kswjz.com/article/dedjjg.html

扫二维码与项目经理沟通

我们在微信上24小时期待你的声音

解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流

其他资讯