VPS参考测评推荐
专注分享VPS主机优惠信息
衡天云优惠活动
华纳云优惠活动
荫云优惠活动

别急,教你写微信小程序(微信阅读小程序)

主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情!
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作

微信小程序开发专栏今天详细教你写微信小程序。别急,教你写微信小程序(微信阅读小程序)

小程序历史介绍什么是微信小程序?微信小程序,简称小程序。英语小程序是一个不需要下载安装就可以直接使用的应用。他实现了他触手可及的梦想。用户可以通过扫描或搜索直接打开应用程序。

为什么微信小程序微信有大量用户推广app或者微信官方账号?开发和改编成本太高,容易小规模试错,然后快速迭代跨平台历史?2016年1月11日张小龙,微信内部研究了一个新的形式,应用号,后来改名为小程序。2016年8月12日开始内测。2017年1月9日在线#环保规范

注册账户

Mp.weixin.qq.com/(账户信息---邮箱激活--信息注册)

获取id

APPID(

开发者工具

微信开发者工具下载

小程序开发者工具开发者工具简介

快捷键:

1.ctrl+shift+F(搜索)2。alt+shift+F(代码格式---VSCode)复制代码<img src=&;https://img.zhujicankao.com/upload/article/000/000/052/62154dd59d731a99e80263d5b4735b83-0.jpg Support/typora-user-images/image-20200707112457994.png&; alt=&;image-20200707112457994&; style=&;zoom:50%;&; />

applet的原生框架。小程序的原生框架,mina框架的细节

小程序配置文件(写配置文件写在微信开发者工具里,有提示)app.json全局配置文件

全局档案*页面:添加要创建的档案项目,保存后自动生成档案*

*

Page.json页面配置文件

网站地图

小程序的模板语法wxml--->: HTML(结合基本组件、事件系统、页面结构外的组件)

相当于,内联标签,它不换行,相当于,块级元素,它换行数据绑定{{data}}。

运算-->:表达式(数值计算、字符串串联、三元表达式)

循环(wx:for)

Wx:key绑定数组中的唯一属性,wx:key =这表示该数组是一个普通数组,而“this”是一个循环项。

lt查看wx:for = ;{ { person } } wx:for -item = ;item wx:for -index = ;索引 wx:key = ;id gtindex:{ { index } } Name:{ { item . Name } } :占位符标签

条件呈现(wx: if) (wx: if,wx: elif,wx: else)(隐藏属性通过添加样式来呈现)

如果不经常用于标记切换,则hidden经常用于标记切换。

事件绑定关键字:bind (bindinput,bindtap [click event])

获取事件源对象的值:

E.detail.value复制代码以获取data中数据的值:

This.data.property名称复制代码将事件源对象的值设置回数据:

this . setdata({ num:this . data . num+operation });代码事件绑定不能直接传递,但应通过自定义属性({ {传递的参数}})传递:

ltbutton bindtap = bandletap data -operation = ;{ { 1 } } gt+ lt;/button gt;bandlet AP(e){//console . log(e);const operation = e . current target . dataset . operation;this . setdata({ num:this . data . num+operation });},屏幕宽度等于750px时复制代码样式尺寸单位,1px = 1rpx

当屏幕宽度等于375像素时,1px =0.5rpx

样式导入只支持相对路径选择器(微信小程序不支持通配符)。小程序的内置组件。小程序中常用的布局组件:

视图、文本、rich -文本、按钮、图像、图标、游标、单选按钮、复选框等。复制代码视图标记等效于p标记。

文本标签只能嵌套在文本标签中。长按文字复制【可选】(只有这个标签有这个功能)。您可以解码回车和空格。

图片标签(在线包大小不能超过2M,使用图片时统一使用外部图片)

图片有一个默认的宽度和高度(320px 240px)。

模式决定了图片内容和图片标签的适配。

scaleToFill的默认值不保持纵横比,而是拉伸到标签定义的宽度和高度。

AspectFit保持纵横比以确保图片的长边被完全显示(常用的carousel)

AspectFill短边完全显示

fix的宽度不变,高度自动变化,原来的长宽比不变。

顶部、左侧、底部、右侧背景地图定位

小程序中的图片直接支持懒加载。

Lazy-load会自行判断,当图片出现在视口的上下三个屏幕时,会自行开始加载图片。

Swiper标签---"转盘

Swiper height = swiper width *图片高度/原始图片宽度

ltswiper自动播放间隔= 1000 圆形指示器-点 gt//图片默认宽度和高度为320 * 240 < swiper -item gt; lt图像模型= 宽度固定 src = &;/ gt; lt/image gt; lt/swiper -item gt; lt/swiper gt;复制代码导航器导航组件(块级元素,默认换行)

lt导航器url = /pages/主页/索引 open -type = ;导航 gt lt/navigator gt;复制代码rich-text(富文本标签,将字符串解析成相应的标签,相当于v-html)

// 1标签字符串< rich -text nodes = ;{ { html } } gt lt/rich -text gt;// 2对象数组< rich -text nodes = ;{ { html.model } } gt lt/rich -text gt;复制代码按钮按钮

大小(size:mini/default)、颜色(type:default/primary/warn)、是否镂空(plain)、文字前是否有加载(loading)、开发能力(opentype)

Opentype(开放类型):

Concat直接打开客服对话功能,需要在小程序后台配置。

将小程序的appid从测试号改为自己的appid,登录微信小程序官网,添加客服-微信分享,将当前小程序转发给微信好友,不转发给好友。

GetPhoneNumber获取当前用户的手机号码,并结合事件使用。不是企业的小程序账号没有权限获取用户的手机号。

GetUserInfo获取用户的个人信息。

LaunchApp直接在小程序中打开应用。

OpenSetting打开applet内置的授权页面。

只有用户点击的权限才会出现。

反馈打开小程序内置的反馈页面。

图标

类型:键入success、success _ no _ circle、info、warn、watching。success _ no _ circle,info,warn,waiting,cancel,downkload,search,clear

尺寸:尺寸数字/字符串

颜色:彩色

无线电收音机盒

ltradio -group bind change = ;handleChange gt ltradio color = 红色 value = 男性 gt男性</radio gt; ltradio color = 红色 value = 女 gt女性</radio gt; lt/radio -group gt; lt视图 gt选择的有:{ { gender } } </view gt;数据:{性别: &;}、handleChange(e) {//获取单选框的选定值let gender = e . detail . value;//将值赋给data this.setData中的数据({ gender//equivalent to gender:gender })}复制代码的复选框。

ltcheckbox -group bind change = ;handleChange gt lt复选框值= { { item.value } } wx:for = ;{ { list } } wx:key = ;id gt{ { item.name } } lt/checkbox gt; lt/checkbox -group gt; lt视图 gt选定的有:{ { checked list } } </view gt;选中列表:

安装easy less plugin 在这里插入图片描述在vscode中配置(ctrl+shift+p然后输入设置,然后添加以下配置):

"less.compile:{ 出口 : 。wxss }复制上面的代码让人放心,手把手教你写微信小程序的细节。请多关注主机参考其他相关文章!

这几篇文章你可能也喜欢:

本文由主机参考刊发,转载请注明:别急,教你写微信小程序(微信阅读小程序) https://zhujicankao.com/82133.html

【腾讯云】领8888元采购礼包,抢爆款云服务器 每月 9元起,个人开发者加享折上折!
打赏
转载请注明原文链接:主机参考 » 别急,教你写微信小程序(微信阅读小程序)
主机参考仅做资料收集,不对商家任何信息及交易做信用担保,购买前请注意风险,有交易纠纷请自行解决!请查阅:特别声明

评论 抢沙发

评论前必须登录!