微信程序 checkbox 组件

  checkbox组件是一个多选框组件,还可以使用checkbox-group组件来进行绑定事件和实现,真正意义上的多选  checkbox的属性:    value:  属性值  字符串  当在checkbox-group绑定事件时,事件源e所携带的参数中detail checkbox中的value值决定    disabled: 属性值  布尔  是否被禁用    checked: 属性值  布尔  当前是否选中,默认选中    color:  属性值  字符串  字体颜色  checkbox-group组件事件:    bindchange:checkbox-group中选项发生改变时触发change事件 detail={value:[选中的checkbox的value数组]}...

微信程序 button 组件

  button组件拥有强大的功能自身可以拥有很多跟微信风格的样式,且是表单和开放的能力重要的按钮  button的属性:    size:  类型  字符串  按钮的大小      属性值:default  默认的          mini   小尺寸    type:  类型  字符串  按钮的样式类型      属性值:default  默认的          primary  绿色的          warn   红色的    plain:  类型  布尔  按钮是否镂空,背景色透明    disabled:类型  布尔  是否禁用    loading:  类型  布尔  名称前是否带有加载的图标    form-type:类型  字符串  用于form组件会分别触发submit和reset事件      属性值:submit  触发表单的submit事件          reset   触发表单的reset事件    open-type:类型  字符串  微信的开放能力      属性值:contact:打开客服会话,如果用户在会话中点击消息卡片...
代码星球 代码星球·2021-02-08

微信程序的事件

    事件,视图层到逻辑层的一种通讯方式,或者将用户的行为返回到逻辑层,当我们在组件绑定事件之后,当我们触发事件,就会执行逻辑层绑定的事件,处理回调函数,当页面的事件触发之后  页面上元素一些额外事件,通过事件对象传递给我们的回调函数  绑定事件的实例:    通过view标签来给他绑定了一个事件,事件名clickme,在index.js中,我们绑定了一个clickme的回调函数,在回调函数内,我们打印出了事件所传入事件对象的参数  事件对象上,各个属性的一个含义;    type:触发事件的类型    timestamp:触发事件当时的时间戳    target:触发事件的根源组件,包括触发事件组件的id,类型,以及dataset自定义属性的集合    currentTarget:触发事件的当前组件,触发当前事件的id,类型,以及dataset自定义属性的集合    touches:表示我们停留在屏幕上触摸点的一个信息;    changedTouches:表示一个有变化的触摸点的信息;    detail:表示我们绑定事件所携带的数据,包括x/y到页面左上角的距离    小程序的...
代码星球 代码星球·2021-02-08

微信程序的开发框架

  wxss:是一套样式语言,用来描述wxml的组件样式;小程序在css基础上做的修改和扩充的版本  css:是一套样式语言,样式表,用来描述xml和html文件样式的呈现;  设备像素:是图片在设备上显示的小点,这些是固定不变的  css像素:逻辑像素,是我们一套标准来显示屏幕的宽  ppi:独立设备显示的密度    dpr:设备像素除以逻辑像素  微信给的屏幕的宽750px,我们在750px的基础上进行自适应  尺寸单位:rpx(响应式像素)  样式导入:    在css的文件中,在引入另一个css的文件:    @import"文件路径"  正常情况下,你在同名的wxss上样式,就是对应的wxml元素上的样式;  内联样式:在wxml文件中通过标签上的style属性来操作样式;  选择器:id  class  标签  并级  伪类  优先级概念  权重概念;  无穷大的案例:    color:red!important;  这个字体颜色为红色无穷大的权限  nodejs中的javascript    ECMAscript:    Native:用这个模块,来使用原生js,实现原...
代码星球 代码星球·2021-02-08

微信程序语音识别开发过程笔记

由于业务需求,需要使用微信程序语音识别的功能,查找了好多发难,也踩了好多坑,把过程记录一下,或许会帮助到需要的朋友。在小程序中识别用户语音输入的命令关键流程流程:录音存储-->上传录音文件到服务器后台-->读取服务器返回结果关键代码://按键按下事件startRec:function(res){varthat=thiswx.startRecord({success:function(res){vartempFilePath=res.tempFilePath//获取录音文件路径console.log(tempFilePath)//上传卢新文件到服务器wx.uploadFile({url:'http://ipaddress:port/voice_detec',filePath:tempFilePath,name:'voice',//服务器返回识别结果success:function(res){console.log(res.data)vardata=res.datavarjd=JSON.parse(data)if(jd.err_no==0){varmsg=jd.result[...

微信程序更换头像代码

WXML:<viewclass="topImg"><viewclass="topImg-item"><viewclass="t-i-left">头像</view><viewclass="t-i-right"><viewclass="image"bind:tap="imageClick"><imagesrc="{{imgUrl}}{{image}}"/></view></view></view></view>WXSS:.topImg{width:100%;height:200rpx;display:flex;justify-content:center;}.topImg-item{width:700rpx;height:200rpx;display:flex}.t-i-left{width:50%;height:100%;display:flex;align-items:center;font-size:30rpx;}.t-i-right{width:50%...

微信程序,页面分享给朋友和分享给朋友圈,头部脱离标准流

分享给朋友:onShareAppMessage:function(){//imgUrl:'http://www.51dev.com//FileUpload/news/202102/20210202001856437.png'return{title:'奇奇蜜蜂英语',path:'/pages/home/home',imageUrl:'http://www.51dev.com//FileUpload/news/202102/20210202001856437.png'}}分享给朋友圈:onShareTimeline:function(){return{title:'奇奇蜜蜂英语',path:'/pages/home/home',imageUrl:'http://www.51dev.com//FileUpload/news/202102/20210202001856437.png'}} 使顶部脱离标准流"navigationStyle":"custom"效果:...

微信程序:组件样式

一、 组件内的样式对外部样式的影响:    答:1.组件内的class样式,只对组件wxml内的节点生效,对于引用组件的Page页面不生效。      2.组件内部能使用id选择器、属性选择器、标签选择器二、外部样式对组件内样式的影响:    答:1.外部使用class样式,只对外部的wxml的节点生效,对组件内是不生效的      2.外部使用id选择器、属性选择器、不会对组件内容产生影响      3.外部使用了标签选择器,会对组件内产生影响总结:组件内的class样式和组件外的class样式,默认有隔离效果,只对"自身"有效     为了防止样式的错乱,官方不推荐使用id、属性、标签选择器; 三、如何使样式可以相互影响?    答:在自定义组件的.js文件中的Component({})对象里面可以传入一个options属性,      options属性中有一个styleIsolation属性(隔离属性)      styleIsolation属性有3个值:        默认值:isoIated:表示启用样式隔离,在自定义组件内...
代码星球 代码星球·2021-02-02

微信程序中,block的作用

block只是一个标签:  <block></block>并且block标签是不会被渲染出来的block只接收控制属性:wx:if  ||wx:for 那么它的作用到底是什么?它的作用就是充当一个容器,类似于<view></view>举个例子。当我们使用 一个 判断条件  决定 是否显示或者隐藏  多个标签时,通常我们会在外部包裹一个容器,这样方便于我们进行判断,但是在外层的容器<view>标签就只是一个单纯的容器,没有其他作用,并且它会被渲染出来,消耗性能而block则可以起到同样的作用,并且不会被渲染出来...
代码星球 代码星球·2021-02-02

微信程序之for循环

微信程序中也有for循环,用于进行列表渲染。打开微信开发者文档,在框架部分的视图层--》wxml--》列表渲染中可以看到官方给出的for循环实例,在实例中可以看到下面相关说明。默认数组的当前项的下标变量名默认为 index,数组当前项的变量名默认为 item;使用 wx:for-item 可以指定数组当前元素的变量名,使用 wx:for-index 可以指定数组当前下标的变量名。test.wxml<viewwx:for="{{array}}">  {{index}}:{{item.message}}</view><viewwx:for="{{array}}"wx:for-index="idx"wx:for-item="itemName">  {{idx}}:{{itemName.message}}</view>test.jsPage({  data:{    array:[      {message:'foo',},      {message:'bar'}    ]  }...
代码星球 代码星球·2021-01-26

微信程序免费Https获取以及Ubuntu Nginx配置

先贴上Nginx的配置文件userwww-data;worker_processesauto;pid/run/nginx.pid;events{worker_connections768;#multi_accepton;}http{###BasicSettings##sendfileon;tcp_nopushon;tcp_nodelayon;keepalive_timeout65;types_hash_max_size2048;#server_tokensoff;#server_names_hash_bucket_size64;#server_name_in_redirectoff;include/etc/nginx/mime.types;default_typeapplication/octet-stream;###SSLSettings##ssl_protocolsTLSv1TLSv1.1TLSv1.2;#DroppingSSLv3,ref:POODLEssl_prefer_server_cipherson;###LoggingSettings##access_log/var/lo...

部署wepy框架开发微信程序

我用的是yarn,如果你使用的是npm,也可以首先需要安装wepy命令行工具npminstallwepy-cli-g然后在选定的位置使用脚手架工具创建wepy项目wepyinitstandardyy-cabinetPSC:UsersgushiDesktop>wepyinitstandardyy-cabinet?Projectnameyy-cabinet?Projectdescription研一智能药剂柜微信程序项目?Authorgstoken<gushihao@hotmail.com>?UseESLinttolintyourcode?No?UseReduxinyourproject?Yes?Usewebtransformfeatureinyourproject?Yeswepy-cli·Generated"yy-cabinet".接着安装依赖包yarninstall依赖包安装完成之后就可以尝试build了wepybuildwepybuild--watch//这样做可以监视文件变化自动组件编译之后会出现dist目录使用微信web开发者工具打开该目录  ...

微信程序(黑马优购)完成!!{10天}

wxml,json,wxss,js,mina框架附上视频链接添加链接描述...

微信程序 webview直接关闭所有回到小程序

   答案:首先要引入最新版的jweixin-1.3.2.js,然后  wx.miniProgram.navigateTo({url:'/pages/login/login'+'$params'})参考地址:https://github.com/yisainan/web-interview/issues/1054方案二:最近在做小程序的时候发现小程序进入webview页面里,在webview页面里有时会出现点击左上角返回,无法返回小程序。解决思路:通过微信浏览器监听返回按键和H5跳转小程序的方法。在webview嵌入的H5首页监听微信返回按键,直接从H5页面中去跳转到小程序内;//方法<scriptsrc="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>$(function(){      pushHistory();      ...
首页上一页...678910...下一页尾页