zoukankan      html  css  js  c++  java
  • input和btton的相互使用————小程序

    input和btton的相互使用————小程序

    index.js

      data: {
       userxx:'1111',
    
      },
      changeSum(){
        // this.data.userxx="changeSuccess",这种方法定义不辽的,不要用这个
        this.setData({
          userxx:"2222"
        })
      },
    

    index.wxml

    <button class="btn" bindtap="changeSum">简单的修改数据</button>
    <view >{{userxx}}</view>
    

    这是简单的button改数据。↑

    下面说一下,input输入的数据来改视图,通过button点击

    先说个简单的,input的数据直接获取!

    getPhone: function (e) {
        var val = e.detail.value;
        this.setData({
          telphone: val
        });
      },
    

    index.wxml

    <input type="number" placeholder="请输入手机号" class="inp-holder" maxlength="11" bindinput="getPhone" />
    <view >{{telphone}}</view>
    

    input的数据实时的显示出来!!

    下面通过点击button获取 input的数据,到某个view中(不点不会显示)!

    index.js

    getPhone: function (e) {
        var val = e.detail.value;
        this.setData({
          telphone: val
        });
      },
      getInput: function () {
        var inp = this.data.telphone;
        this.setData({
          inputSum: inp
        });
      },
    

    index.wxml

    <input type="number" placeholder="请输入手机号" class="inp-holder" maxlength="11" bindinput="getPhone" />
    <button class="btn" bindtap="getInput">input数据来修改数据</button>
    <view >{{inputSum}}</view>
    

    步骤:

    1. 把input的数据拿出来。放到telphone
    2. 点击后,inputSum去拿telphone的数据。
    3. 这只是获取到view,其实可以获取到api就可以调用数据。
  • 相关阅读:
    qsort()的使用
    c语言不寻常的类型转换(类型提升)
    堆栈段的三个主要用途
    区分 声明与定义
    宏定义陷阱与typedef
    约瑟夫环解决方案
    线程中断测试
    Redis
    本地缓存
    tomcat优化
  • 原文地址:https://www.cnblogs.com/cth0/p/11568729.html
Copyright © 2011-2022 走看看