前言：该学原生小程序啦

文档：

微信开放文档

工具下载：

稳定版 Stable Build | 微信开放文档

HBuilderX-高效极客技巧

你要是uniapp开发的就这个HB编译器打开项目运行在微信开发工具上

基础配置使用：

新增页面

在全局的json里面那个pages数组里添加，自动生成一个文件夹，这个文件夹下有四个文件

机型单位：

选择375的iphonex开发，2rpx=1px

全局配置：

pages：页面，通俗理解就是路由吧
window：窗口配置
style：版本

基础语法：

模板语法：

{{}} 和vue2一致

数据处理：

1：只要是data里面定义的数据，页面上面使用都必须带上{{}}

2：修改data数据的唯一方法：

setData方法里面的对象就是整个data里面的对象，改哪个就写那个

3：拿data里面的数据需要 this.data.数据名，比如下面的例子，将数据取反

事件：

基础知识：

bind 绑定事件名然后设置事件方法

tap相当于click，，@tap等同于bindtap

事件方法名直接写在data同级的位置就好了，不需要写在methods里面了哈哈哈

事件对象

绑定事件的dom身上传e，就是本身节点了，这个你应该知道吧

双向数据绑定：

<input model:value="{{value}}" />

列表渲染：

    <!-- 普通数组可以使用wx:key="*this" 只用一层循环可以省略item和index在标签中 --><view class="customr-item" wx:for="{{list}}" wx:for-item="item" wx:for-index="index" wx:key="id">name：{{item.name}}---index：{{index}}</view>

wx:for-item="item" wx:for-index="index" 用来命名，多层渲染有用

列表渲染常常配合block标签，这个标签不会渲染出来

条件渲染:

wx：if 等于vue里面的v-if

hidden 原理和v-show一样

这个hidden是反着来的。根据英语单词意思

条件判断 wx：elif wx：else

wxs：作用和过滤器一样，加工处理数据

第一种写法：写在wxml里面的js

第二种写法：新建wxs的文件，然后src导入

模板：

可传值模板

新建文件夹templates下的temp.wxml。可以写templete模板

然后在页面导入，用is区分

前端程序员需要了解的原生微信小程序-基础知识相关推荐

mpvue 微信小程序api_第三方框架与原生微信小程序开发框架性能之比较 | Q荐读...
作者 | 崔红保编辑 | 王莹自 2017年1月9日微信小程序诞生以来,历经 2 年多的迭代升级,已有数百万小程序上线,成为继 Web.iOS.Android 之后,第四大主流开发技术. 与之相随, ...
微信小程序从0到上线，程序员一个月开发一款小程序实录
前言:本人从事游戏开发多年,是一名饱受折磨的游戏前端开发人员.游戏这个行业越来越难做,加班越来越严重.正值行业转变之际,听闻微信小程序热火之时,我想偿试一下小程序制作,因此,一个月之后有了这篇文章:微 ...
【微信小程序】---- redux 在原生微信小程序的使用实例
weapp-redux 下载 weapp-redux 使用实例下载预览开发 1. 目标学会 redux 在原生微信小程序的使用: 学习和思考微信小程序中封装 Provider: 2. 引入 re ...
大前端（移动端/桌面应用Electron/微信小程序/小程序、快应用框架）
移动端 Web 总体认识客户端的所有形式:Native App(IOS.Android.Mac.Windows),小程序(微信.百度.支付宝.字节跳动),桌面端网页.移动端网页(浏览器H5.webv ...
c语言京东购物系统,仿京东商城: 自主使用微信小程序实现的网上商城案例（包括前端和后台），利用了微信小程序的云数据库...
仿京东网上商城介绍自主使用微信小程序实现的仿京东网上商城案例(包括前端和后台),数据库利用了微信小程序的云数据库软件架构软件架构说明数据库表设计本系统数据库主要用了微信小程序自带的云数据库 ...
原生微信小程序使用class 三元运算符实现多选案例
原生微信小程序使用class 三元运算符实现多选案例如下图所示: 1,在vue中开发非常容易实现,使用数组的includes方法判断即可,但是在原生小程序中不可以 2,要及时的对定义的遍历进行set ...
原生微信小程序购物车
原生微信小程序购物车!! 效果: html: <view style="background-color: #eeeeee;height: 100vh;"><vi ...
原生微信小程序项目基础框架搭建
原生微信小程序项目基础框架搭建文件目录结构 1. 环境变量(开发环境, 线上环境,测试环境)便于在不同环境的切换接口的url webview的前缀url 埋点相关的环境参数本地存储的环境变量配置 ...
原生微信小程序，scroll-view的使用，一屏两个滚动区域，scroll-y（纵向滚动）
原生微信小程序,scroll-view的使用,一屏两个滚动区域,scroll-y(纵向滚动) 这个会简单很多结构层 <view class="container">& ...

前端程序员需要了解的原生微信小程序-基础知识

文档：