• 微信小程序入门2


    小程序的模板

    Template  定义template 可以在模板中定义代码片段,然后再不同的地方调用,使用name属性定义模板的名字。

    使用template 使用is属性,声明要使用的模板,然后将需要的数据从js的data传入。

    引用wxml的两种方式

    import:在该文件中使用目标文件定义的template。

    例:

    import的作用域:import只能引用目标文件的template,不能引用目标文件import引用的template

    include:include可以将文件除了template、wxs外的整个代码引入,相当于是拷贝到include的位置

    小程序的样式wxss

    wxss和web的css类似,不同的是wxss引用了新的尺寸单位,rpx可以适配不同的屏幕宽度,

    1rpx = 屏幕宽度 / 750px

    小程序中的wxss引入不同,@import  ‘./test.wxss’

    小程序中的样式选择器:类选择器,id选择器,元素选择器,伪元素选择器

    小程序渲染数据:

    在元素中用差值表达式{{msg}}绑定一个变量,在js中的data中定义这个属性初始值,

    改变data中的值:this.data.msg = 值,  注意:这样只会改变data中的值,不会改变渲染层

    改变渲染层数据:this.setData({msg:值})

    小程序中的通讯是多线程的

    页面构造器

    Page({  //页面

    data:{

    //存放数据

    },

    onLoad:function(options){

    //生命周期函数:监听页面加载    options接收传过来的值

    },

    onready:function(){

    //声明周期  监听页面初次渲染完成

    },

    onShow:function(){

    //生命周期   监听页面显示,触发早于onReady

    },

    onHide:function(){

    //生命周期    监听页面隐藏,,例如后台状态

    },

    onUnload:function(){

    //生命周期   监听页面卸载

    },

    onPullDownRefresh:function(){

    //监听下拉刷新

    },

    onreachBottom:function(){

    //监听页面触底事件,例如触底加载

    },

     onShareAppMessage:function(){

    //用户转发

    },

    onPageScroll:function(){

    //页面滚动事件

    }

    })

  • 相关阅读:
    genEcc256-test
    Android 9 自动恢复出厂设置问题(auto-recovery)
    C_练习题 10
    C++ 基础与深度分析 Chapter10 泛型算法(bind、lambada表达式、泛型算法的改进ranges)
    【知识点随笔分析】我看看谁还不会用CURL命令
    Java学习Day027(Java常见面试题21-25)
    设计模式-观察者模式
    SpringBoot_整合Mybatis
    电压参考芯片 LM285D-1.2 备忘
    .NET周刊【8月第1期 2023-08-06】
  • 原文地址:https://blog.csdn.net/Youaremysalvatio/article/details/126140672