微信小程序weui的使用(1)

最新推荐文章于 2024-04-22 13:36:17 发布
最新推荐文章于 2024-04-22 13:36:17 发布
阅读量1.2k 收藏 19
点赞数 26
分类专栏： 程序员 文章标签： 微信小程序 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2401_84123026/article/details/137438946
版权

在这里插入图片描述

使用组件了，我用index来示范，在index.json写入组件名和路径，（注意路径不可以多些一个空格，末尾也不可以多写一个逗号，会报错）

“mp-checkbox”: “…/…/miniprogram_npm/weui-miniprogram/checkbox/checkbox”

在这里插入图片描述

checkbox就是我用来演示的单选框组件，要用其他组件的话打开miniprogram_npm文件夹下的weui-miniprogram文件夹，然后里边就是官方已有的组件，要用改一下名字和地址名就ojbk了。

在这里插入图片描述

然后在index.wxml中使用组件

效果：

结束！！！

方法二：下载导入方式

1.下载weui

进入GitHub

最低0.47元/天 解锁文章
2401_84123026
关注
  • 26
    点赞
  • 踩
  • 19
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
weui微信前端样式
07-24
weui微信前端样式
微信小程序weUI组件所有demo示例
10-17
标题中的"微信小程序weUI组件所有demo示例"指的是这个压缩包包含了WeUI框架在微信小程序中的所有组件的演示示例。这些示例可以帮助开发者直观地了解每个组件的功能、用法和样式效果，从而在自己的项目中更方便地应用...
微信小程序踩坑之一【weui-wxss-master单选按钮图标修改思路】
weixin_30371875的博客
06-08 658
小程序原生所带的weui框架做小程序UI实在太方便了，但是他的一些细微变化也是让开发中碰到不少头疼的问题 一直以来单选多选的美化都是设计师重点表达的地方之一 而weui-wxss-master中的单选多选样式又写的与众不同，不同与常规的weui添加after伪类来显示 不同，他是通过type="success_no_circle"来实现的，所以无论怎么更改icon或icon的after或bef...
微信小程序checkbox样式的修改
最新发布
m0_75230853的博客
04-22 174
【代码】微信小程序checkbox样式的修改。
weui实现（单列选择器）
小白的博客
10-18 1211
1、插入weui的js，css和vue.js（weui的css和js版本需要对应） <!-- 引入weui框架及js --> <link rel="stylesheet" href="/static/weui/weui.min.css"> <script type="text/javascript" src="https://res.wx.qq.com/open/libs/weuijs/1.2.1/weui.min.js"></script&gt
微信小程序--下拉选择框组件封装,可CV直接使用
m0_74444744的博客
10-12 4045
微信小程序--下拉选择框组件封装,可CV直接使用
weui 弹框中的单选效果
weixin_30546189的博客
01-07 635
<!--性别修改弹框--> <div class="weui_dialog_alert" id="doctorSexDialog" style="display: none;"> <div class="weui_mask"></div> ...
微信小程序WEUI 控件 sketch mac
04-30
weui是微信团队自己出的sketch控件，里面都是最新的小程序控件，可直接添加到sketch里面使用。需要的自取。
微信小程序中weui用法解析
12-13
在做微信小程序的时候就想着找一个UI库，方便我们前端开发，然后查找资料，发现了这个WeUI特别适合放在微信小程序里。下面就简单的了解一下。 WeUI是一套跟微信原生的视觉体验类似的一套样式库，由微信官方设计团队...
微信小程序WEUI AXURE组件
03-29
微信小程序WEUI AXURE组件
微信小程序weui.wxss官方文件
08-08
微信 weui. weui,复制到根目录下，再入aap.wxss里【】@import "weui.wxss"，就可以直接调用了。微信官方 weui下载地址:https://github.com/weui/weui-wxss/ weui。自己备份在这里留用。
WeUI JS弹出选择层,带滚动,非JQ
04-23
WeUI JS弹出选择层,带滚动,非JQ
weui多选组件
07-27
weui多选组件，weui多选组件，weui多选组件，weui多选组件，weui多选组件
iPhone的ckeckbox实现方法
无限互联@彪哥
10-14 282
-(void)checkboxClick:(UIButton *)btn { btn.selected = !btn.selected; } - (void)viewDidLoad { UIButton *checkbox = [UIButton buttonWithType:UIButtonTypeCustom]; CGRect checkboxR...
php weui单选框样式,weui 弹框中的单选效果
weixin_29924309的博客
03-13 626
医生性别男女确定$('#saveDoctorSex').click(function(){var doctorSex = $("input[name='sex']:checked").val();console.log("3416456" + doctorSex);$('#doctorSexShow').html(doctorSex);});layer&period;open弹框中的表单数...
php weui单选框样式,共用CSS样式.html
weixin_30462741的博客
03-13 104
dodou-移动框架table{ border-collapse:collapse; border:1px solid #e7e7e7; width: 100%;}table tr td{ border:1px solid #e7e7e7; padding:10px;}table th{ padding:15px;}字体大小.f12font-size:12px;.f13font-size:13px...
webui之单选框操作学习
qq_45948176的博客
03-08 173
判断当前单选按钮是否选中状态。定位单选按钮 点击女性。
weui单选按钮获取的选中的值为“on”的解决办法
weixin_44110923的博客
09-02 618
weui单选按钮获取的选中的值为“on”的解决办法
使用weui进行选择文本数据，并展示到某个文本框内
qq_45728838的博客
08-12 477
//首先是点击事件的代码展示 //这部分是jsp页面设置点击事件 <a class="msgBtn">常用语</a> //这一部分是js点击事件 $(".msgBtn").click(function(){ //方法{}是我们传入的参数，function内是返回值 //传入参数的，假设传入id //SEARCH.deptSearch({Ids:"1"},function(obj) SEARCH.messageSearch({},function(obj){ $
微信小程序weUI提示框使用
06-09
要使用weUI的提示框功能，需要先引入weUI的样式文件和JavaScript文件。在页面中可以使用以下代码来引入： ```html <link rel="stylesheet" type="text/css" href="/path/to/weui.min.css"> <script type="text/javascript" src="/path/to/zepto.min.js"></script> <script type="text/javascript" src="/path/to/weui.min.js"></script> ``` 其中，`weui.min.css` 是weUI的样式文件，`zepto.min.js` 是weUI所依赖的JavaScript库，`weui.min.js` 是weUI的JavaScript文件。 在页面中使用weUI的提示框，可以使用以下代码： ```javascript // 弹出成功提示框 weui.toast('操作成功', { duration: 2000, className: 'custom-classname', callback: function(){ console.log('close'); } }); // 弹出加载中提示框 weui.loading('数据加载中'); // 隐藏加载中提示框 weui.hideLoading(); ``` 其中，`weui.toast` 方法用于弹出成功提示框，`weui.loading` 方法用于弹出加载中提示框，`weui.hideLoading` 方法用于隐藏加载中提示框。 `weui.toast` 方法有以下参数： - `message`：提示框显示的文本内容。 - `options`：可选参数，包括： - `duration`：提示框显示的时间，单位为毫秒，默认为3000毫秒。 - `className`：提示框的自定义类名。 - `callback`：提示框关闭时的回调函数。 更多关于weUI的提示框使用方法可以参考weUI的官方文档。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值