合集-微信小程序
摘要:什么是微信小程序 微信小程序是腾讯2017年1月9日正式上线的一种基于微信的无需安装的应用程序 什么是基于微信? 简单粗暴的理解就是运行在微信中的应用程序, 如果没有安装微信则不能运行 什么是无需安装? 无需安装只是宣传噱头, 本质上小程序也是需要下载安装的,只不过微信官方对小程序安装的大小有严格的
阅读全文
摘要:打开微信开发者工具: 新建项目: 使用小程序管理员微信, 扫码登录开发者工具: 使用申请到的AppID创建一个小程序: 利用微信开发工具开始开发: 除了利用微信开发者工具可以开发微信小程序以外, 其实通过VSCode/WebStorm等主流开发者工具也能开发微信小程序, 只不过需要简单的配置一下,
阅读全文
摘要:关于本文主要介绍一下我们之前文章当中创建的第一个微信小程序当中的 app.json 文件它自带的默认配置项是何含义,首先创建一个全新的小程序项目,然后将其所有文件进行删除: 会发现提示你,app.json 未找到说明一个问题微信小程序会自动的去寻找有一个 app.json 的文件进行读取,然后我们来
阅读全文
摘要:好了经过我们上一章关于 app.json 的介绍我们已经知道了一个微信小程序的启动,必须要包含一个 app.json 文件,那么我们有没有发现一个问题,那么就是,我们并没有 app.js,app.wxss,说明这两个文件不是必须的,app.json 才是必须的,那么那两个文件什么时候才进行使用呢,只
阅读全文
摘要:经过我上一章的讲解 sitemap.json 文件的作用之后我们就明白了,这个文件主要的作用就是给微信小程序进行 SEO 检索爬虫进行使用的,我们可以让需要的页面开放出去,不需要开放的我们禁用即可,可以有很多检索文件的规则等等,本文将介绍一下 app.js 这个文件的作用与含义。 App.js 一样
阅读全文
摘要:经过我们上一章的介绍 app.js 文件之后我们知道了这个文件可以监听小程序的生命周期与存放一个全局的使用数据,那么接下来我们在来看关于微信小程序的全局的文件 app.wxss (全局样式文件)。 app.wxss 要演示这个全局样式首先我们要有多个页面,创建一个 log 页面: 然后发现我们创建完
阅读全文
摘要:关于小程序组件的部门内容,我们先介绍这里,我们在回到我们的微信小程序的配置文件刨铣最后一个文件,这里就算彻底的入了个小门,本章介绍的是 project.config.json 文件的配置含义: 官方文档:https://developers.weixin.qq.com/miniprogram/dev
阅读全文
摘要:经过之前的 app.wxss 文件的介绍,知道了该文件的内容是设置的全局的样式文件,那么本文将开始逐一的介绍关于 页面 的配置项。 .json 文件 小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。 每一个小程
阅读全文
摘要:经过上一章的页面.json文件的介绍,我们知道了页面的.json文件可以覆盖全局文件的配置项。本章主要讲解一下页面目录当中下的.js文件,该文件主要作用于页面的数据管理和生命周期。 官方文档:https://developers.weixin.qq.com/miniprogram/dev/refer
阅读全文
摘要:经过上一章的介绍我们就知道了页面当中的.js文件是当前页面的生命周期与数据存储的逻辑文件,本文将开始来带着友友们来了解下微信小程序当中的组件的创建与使用方式。 创建 首先在工程当中创建一个 components 文件夹,然后在当中创建一个 demo 组件,鼠标右键 components 文件夹新建
阅读全文
摘要:经过上一章节的介绍,我们知道了在微信小程序当中组件的创建与使用,本文将继续来刨铣组件当中的每一个文件的作用其含义,这次介绍的是组件当中的 .json 文件。 .json 官方文档的介绍地址:https://developers.weixin.qq.com/miniprogram/dev/framew
阅读全文
摘要:经过上一章节的介绍,我们知道了在微信小程序当中组件的.json文件的作用其含义之后,本文将继续来刨铣组件当中的每一个文件的作用其含义,这次介绍的是组件当中的 .js 文件。 其实呢这个js文件你自己结合我们之前讲解过来的这么多内容了你应该也是可以猜得出这个是用来监听组件的生命周期和组件的数据存储逻辑
阅读全文
摘要:什么是 WXSS WXSS (WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式。 WXSS 用来决定 WXML 的组件应该怎么显示。 为了适应广大的前端开发者,WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序,WXSS 对 CSS 进行了扩充以及
阅读全文
摘要:行内样式 <view style="color: red;">行内样式</view> 页面样式 编写在当前页面文件夹当中的 WXML 的 WXSS 文件当中: index.wxss: .pageStyle { color: pink; } index.wxml: <view class="pageS
阅读全文
摘要:!> 在企业开发中,拿到设计师设计的750设计图之后,我们只需要将模拟器调整为 iphone6,然后将设计图上标注的 px 乘以2,写到样式中,单位使用 rpx 即可。 关于更多的关于响应式的内容可查看我之前介绍响应式单位的文章: https://www.cnblogs.com/BNTang/tag
阅读全文
摘要:什么是WXML WXML(WeiXin Markup Language)是框架设计的一套标签语言,类似于HTML,结合基础组件、事件系统,可以构建出页面的结构。 要完整了解 WXML 语法,请参考WXML 语法参考。 特点 严格区分大小写 正确示例: <text>严格区分大小写</text> 错误示
阅读全文
摘要:WXML 如何绑定数据 企业开发中大部分数据不是直接写死在界面中的,而是在程序运行的过程中动态从服务器获取的 将可变化的数据动态渲染到界面上,我们称之为绑定数据 在小程序中,所有需要动态绑定数据的地方,都需要使用 Mustache 语法 {{ 需要绑定的数据 }} 在微信小程序当中,绑定数据分以下几
阅读全文
摘要:默认组件,只要被书写出来,都会渲染到界面上。 wx:if 在框架中,使用 wx:if="" 来判断是否需要渲染该代码块: index.wxml: <view wx:if="{{condition}}"> True </view> index.js: // pages/index/index.js P
阅读全文
摘要:hidden 属性 在 Vue 中我们可以通过 v-show 来控制组件是否显示 在小程序中所有组件都支持hidden属性,我们可以通过hidden属性来控制组件是否显示隐藏 wx:if和hidden的区别 和 Vue 中 v-if/v-show 一样,不经常切换使用 v-show(wx:if),经
阅读全文
摘要:WXML 中的列表渲染 在组件上使用 wx:for 控制属性绑定一个数组/数字/字符串, 即可使用数组中各项的数据重复渲染该组件,wx:for 默认自动将当前遍历到的数据放到 item 变量中,会自动将当前遍历的索引放到index变量中,如果想修改保存数据的变量名称,或修改保存索引的变量名称,我们可
阅读全文