• 简书网微信公众号二维码
您当前的位置: 首页 > 网站建设 > 微信小程序引用weui操作步骤

微信小程序引用weui操作步骤

时间:2023-07-01 14:05 阅读数:107 人阅读 分类:网站建设

  微信小程序开发要运用到很多工具和小程序码,小编在之前的文章中初步介绍了小程序weui的一些资料,今天接着讲一下微信小程序引用weui怎么弄。

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

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

  


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

  


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

  WXSS 用来决定 WXML 的组件应该怎么显示。

  为了适应广大的前端开发者,我们的 WXSS 具有 CSS 大部分特*。 同时为了更适合开发微信小程序,我们对 CSS 进行了扩充以及修改。

  与 CSS 相比我们扩展的特*有:

  尺寸单位

  样式导入

  4.在app.wxss导入样式

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

  


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

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

  a)数据绑定

  


  b)条件渲染

  


  c)事件,关键参数是bindtap

  


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

  


  weui是为微信 Web 服务量身设计的一项工具,微信小程序引用weui其实并没有想象中困难,具体看一下上面的教程就好了,更多相关资料请关注微信小程序素材网。

  

  微信小程序调用js方法,微信小程序引用js的方法

  小程序码怎么用?如何用微信小程序码?

  如何使用微信小程序ui框架?