WeUI

Create by jsliang on 2018-9-17 17:58:56 Recently revised in 2018-11-19 08:19:13   Hello 小伙伴们，如果觉得本文还不错，记得给个 star ， 你们的 star 是我学习的动力！ GitHub 地址 写在前面  首个微信小程序实践记录:  工作量: PSD 18 张 (导出的 JPG 30 张)  耗时：12 个工作日  总结1: 在页面制作商，需要 3 周工作日（工作 15 天）搞定，前后端对接口另计。实际上，12 个工作日可以搞定所有页面，但是应该往前铺 1.5D 熟悉框架，往后铺 1.5D 整理代码。当然每个人的耗时可能不同，可根据个人实际情况进行调整。  总结2：在 API 调用上，根据接口数量可能需要 7-12 个工作日进行 API 调用，难点表现在： 1. 接口不够丰富，数据量不足； 2. 接口数据不够正式真实，跟前面的假数据相差太大； 3. 接口可能没法正常调用 等原因。故因根据小程序业务逻辑进行工作时长的报备。   这里有 jsliang 微信小程序开发中遇到的所有坑，以及在填坑过程中的一些个人经验。jsliang 利用这篇教程存储一些常用的微信小程序开发技巧，方便查找。它可能教不了你什么，但至少能省下你百度的功夫。   请结合 《目录》 和 《返回目录》 来进行跳转

解决方案;　picker和Select组件是通过input标签绑定，可以先通过input的父级元素移除input标签，重新插入input标签，最后重新初始化picker或Select组件。 <div class="weui-cell"> <div class="weui-cell__hd"><label for="time-format" class="weui-label">性别</label></div> <div class="weui-cell__bd"> <input class="weui-input " id="appl_sex" name="appl_sex" type="text" value=""> </div> </div> <div id="box"> <input type="text" id='camera' value="前置摄像头"/> </div> js代码： $("#appl_sex").picker({ title: "请选择", cols: [ { textAlign: 'center', values: ["1",'2'] } ], onChange: function(p, v, dv) { console.log(p, v, dv); }, onClose: function(p, v, d) { console.log("close"

本文转载于: 猿2048 网站➦ https://www.mk2048.com/blog/blog.php?id=hc20h1cbaa 引言 现在的前端有各种各样的新知识和新框架，小程序才出生几年，就已经火到这种程度了，所以作为前端学习者，这个新技能我们是一定要尽快get到的。学习小程序最好的方法就是自己手写一个小程序，能从中找到自己的不足之处。于是我便萌发了一个新想法，自己手撸一个拉勾小程序。刚开始的时候，起步是有点难的，不知道怎么把学的东西转化成自己想要写的东西，但谢了一点后，感觉有点入迷了，停不下来。希望我写的东西能够帮助社区的学习者，如果写的不好，也欢迎你指正。 开发工具与资源平台 微信web开发者工具 ：用于敲网页代码，但是最主要用来进行手机效果预览。 VsCode :主要用于布局排版，也是敲代码的主战场，真心觉得这个编辑器不错，快捷输入和排版，大大提高了开发效率，使用简单，一学就会。 Iconfont-阿里巴巴矢量图标库 ：提供项目中的所有图标，资源丰富。 微信小程序开发者文档 :微信小程序开发的文档，资源库，以及API规范 Easy Mock : 可以模拟我们想要的数据，非常方便。这里是部分数据 预览图片 功能展示 数据请求 拉勾里面有非常多的数据，所以我在easy mock里面创建了很多接口，在页面需要用到的时候去 请求数据，如果每一次都要用wx.request

图片路径： https://download.csdn.net/download/ypz131023/10825133；（需要的可以私聊给） 示例效果图 js代码块 test <div class="weui-tab"> <div class="weui-tab__bd"> <div id="tab1" class="weui-tab__bd-item weui-tab__bd-item--active"> <div class="weui-search-bar" id="search_bar"> <form class="weui-search-bar__form"> <div class="weui-search-bar__box"> <i class="weui-icon-search"></i> <input type="search" class="weui-search-bar__input" id="search_input" placeholder="搜索" /> <a href="javascript:" class="weui-icon-clear" id="search_clear"></a> </div> <label for="search_input" class="weui-search-bar__label" id="search_text"> <i

weui样式看到hd ，bd， ft hd 是header的缩写 bd 是body的缩写 ft 是footer的缩写 weui hd bd ft 原文：https://www.cnblogs.com/zhaogaojian/p/9229707.html

使用WEUI uploader上传图片，博主费了很大的劲总算找到完整的了，并且带后台接收代码，有需要的朋友拿去吧，亲测可用！ 一、html代码 < link rel = "stylesheet" href = "https://res.wx.qq.com/open/libs/weui/0.3.0/weui.css" /> < div class = "weui_uploader" > < div class = > < div class = >图片上传</ div > < div class = >0/6</ div > </ div > < div class = "weui_uploader_bd" > < ul class = "weui_uploader_files" > </ ul > < div class = "weui_uploader_input_wrp" > < input class = type = "file" accept = "image/jpg,image/jpeg,image/png,image/gif" multiple = "" ></ div > </ div > </ div > 二、JS代码 $( function var 'image/jpg' 'image/jpeg' 'image/png' 'image/gif' ]; var

一、WeUI WeUI是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信 Web 开发量身设计，可以令用户的使用感知更加统一。包含button、cell、dialog、toast、article、icon等各式元素。 转载请标明出处: WeUI 文章来源: WeUI

一：微信小程序注册按钮首页 代码： <!--pages/face/face.wxml--> < view class = "page"> < view class = "page__hd"> < view class = "page__title"> 人脸采集与识别 </ view > < view class = "page__desc"> 学生信息（包括人像）采集，刷脸登录 </ view > </ view > < view class = "page__bd page__bd_spacing"> < button class = "weui-btn" type = "primary" bindtap = 'message'> 学生注册 </ button > < button class = "weui-btn" type = "warn" bindtap = 'face'> 人脸识别 </ button > < button class = "weui-btn" type = "default" plain = "true" bindtap = 'list'> 学生列表 </ button > </ view > </ view > js代码： // pages/button/button.js Page({ //注册按钮跳转 message: function () {

1程序首页 2.页面代码 < view > < view > 人脸采集与识别 </ view > < view class = 'title'> 学生信息（包括人像）采集，刷脸登录 </ view > < view class = 'cont'> < button type = "primary" class = 'zhu' bindtap = 'zhuce'> 学生注册 </ button > < button type = "warn" class = 'zhu' bindtap = 'recognition'> 人脸识别 </ button > < button class = 'zhu' bindtap = 'tabulation'> 学生列表 </ button > </ view > </ view > 3.点击进去显示 <view class="weui-cells__title text">录入学生信息</view> <form bindsubmit="formSubmit"> <view class="weui-cells weui-cells_after-title"> <view class="weui-cell weui-cell_input"> <view class="weui-cell__hd"> <view class="weui-label">学号

解决方案;　picker和Select组件是通过input标签绑定，可以先通过input的父级元素移除input标签，重新插入input标签，最后重新初始化picker或Select组件。 <div class="weui-cell"> <div class="weui-cell__hd"><label for="time-format" class="weui-label">性别</label></div> <div class="weui-cell__bd"> <input class="weui-input " id="appl_sex" name="appl_sex" type="text" value=""> </div> </div> <div id="box"> <input type="text" id='camera' value="前置摄像头"/> </div> js代码： $("#appl_sex").picker({ title: "请选择", cols: [ { textAlign: 'center', values: ["1",'2'] } ], onChange: function(p, v, dv) { console.log(p, v, dv); }, onClose: function(p, v, d) { console.log("close"