zoukankan      html  css  js  c++  java
  • 小程序开发-6-组件数据、事件与属性

    组件数据、事件与属性

    数据来源的三种途径

    • 直接在wxml中填写数据
    • 在js中绑定数据
    • 服务器中传数据到js,然后填入wxml

    数据绑定

    //在js中
    data:{
     count: 99
    }
    
    在wxml中
    <View>{{count}}</View>
    

    三元表达式和图片切换

    <image src="{{like?'image/like.png':'image/dislike.png'}}"/>
    

    组件的封闭性、开放性及粒度

    组件封装的难度

    • 哪些在内部,哪些可以放在外部
    • 组件的粒度,可以封装简单功能或非常复杂的功能

    组件的properties属性详解

    properties: {
    like: {
      type: Boolean,//类型必填,Number,String,Boolean,Object,Array,null(任意类型)
    	value: false, //默认值,可以不填,boolean类型的默认值为false
    	observer: function(){} //当传入的值改变的时候,微信小程序会重新执行
    }
    }
    

    注意:properties可以在wxml中用{{}}来绑定,和data类似


    let var 与组件事件应用

    可以用this.properties.like获取properties中的like的值

    let允许你声明一个作用域被限制在块级中的变量、语句或表达式。与var关键字不同的是,他申明的变量只能是全局或者整个函数块的

    if(true){
    	let a = 1;
     let b = 2;
    }
    console.log(b);//2
    console.log(a);//报错
    
  • 相关阅读:
    Java数据结构概述·14
    Java之自定义异常·13
    idea spirng项目jsp页面乱码
    HashMap和LinkedHashMap的区别
    jar包导入仓库中
    后台接口接受前端参数的时候使用包装类和基本类型接受
    转 为什么程序员怕改需求?
    thymeleaf常用标签
    linux查看端口占用情况
    查询linux硬件配置
  • 原文地址:https://www.cnblogs.com/TomAndJerry/p/10490131.html
Copyright © 2011-2022 走看看