小程序笔记——2019/11/14

小程序自定义组件

1. 组件文件

index.json
"component":true   //表明这是组件
index.js
注意把Page改为Component，表明这是组件
properties:{
    showModalStatus:{
      type:Boolean,
      value:false,
      observer:function(newOval,oldVal){
        console.log(oldVal,newOval);
      }
    },
    animationData:{
      type:Object,
      value:{}
    }
  },
组件中properties的数据是对外暴露的，可以被外部文件改变
组件中data的数据是私有的，不会被外部文件改变
组件中的methods负责存放组件的函数

2. 使用组件的外部文件

challenge.json
"usingComponents": {
    "to_login":"/components/to_login/to_login"
  },
  给文件指定自定义组件和组件名
challenge.wxml
<to_login showModalStatus="{{showModalStatus}}" animationData="{{animationData}}"></to_login>
根据自定义组件名放置组件位置
通过在challenge.js中this.setData来修改showModalStatus这些值来修改组件中showModalStatus的值

3. 参考

困扰几个星期的难题！textarea在键盘弹出后就消失！

1. 父元素是position:fixed布局，而且整个元素是在页面下面，属于弹出框
2. textarea是多行文本输入框，但是点击textarea聚焦之后，fixed="{{true}}"、
3. 尝试过一种解决方案：父元素使用bottom控制和底部的位置，但是在整个页面高度低于200vh左右的时候，textarea会向上飘
4. 所以对于第一种方案，我还必须给整个页面加上一个min-height，效果很差，页面没东西也能滑动。。
5. 第二种解决方案，最后被我找到了原因，因为父元素是fixed定位，那么textarea就必须加上 fixed="{{true}}",然后通过cursor-spacing来调整textarea焦点和键盘的高度，完美结局！

button的lang语言

1. en英文
2. zh_CN简体中文
3. zh_TW繁体中文