微信小程序使用

陈先生2468

已于 2022-09-05 15:52:05 修改

阅读量697

点赞数 1

分类专栏：微信小程序文章标签：微信小程序小程序 javascript 前端

于 2022-09-04 12:43:50 首次发布

本文链接：https://blog.csdn.net/qq_67693370/article/details/126687700

版权

这篇博客详细介绍了微信小程序的各个方面，包括模板语法、事件处理、API使用、全局配置、页面生命周期、页面跳转、数据传递、自定义组件、授权登录、回顶功能、基本功能限制、分包策略以及云开发的原理和应用。

摘要由CSDN通过智能技术生成

微信小程序模板语法

文本渲染
条件渲染
列表渲染
自定义列表
import使用
include使用

文本渲染：

{
   {
   }} //渲染文本

条件渲染：

wx:if="{
   {}}"
wx:elif=“{
   {
   }}”
wx:else

列表渲染：

wx:for="{
   {list}}"
	{
   {
   item}}
{
   {
   index}}
wx:key="title"

自定义列表：

wx:for="{
   {list}}"
wx:for-item="myitem"
wx:for-index="ind"
	{
   {
   myitem}}
{
   {
   ind}}

import使用定义模板：

//定义模板  test.wxml
<temp name="user">
<view>用户名：{
   {
   name}}</view>
//使用
<import src="xxx/test.wxml">
<template is="use" data={
   {
   ...userInfo}}>

include：

拷贝src中非template的内容

微信小程序常用事件

bindtap 触摸点击
bindchange 值发生变化时
bindconfirm 确认
bindinput 输入框发生变化

表单双向：

<input value="{
   {temp}}" bindinput="inputHd">
this.setData({
   temp:e.detail.value})
//获取事件对应表单的值
e.detail.value

事件传参：

<button bindtap="showMsg" data-msg=“你好靓仔”>
showMsg(e){
   
     e.target.dataset.msg
}

响应式更新：

this.setData({
   })
//数据与视图都会更新

微信小程序常用

最低0.47元/天解锁文章