day03 微信小程序

发布时间 2023-03-28 08:17:45作者: 贰号猿

内容回顾

组件

  • view
  • text
  • image
  • textarea
  • navigator
  • button

事件

  • bindtab

api(5个)

今日摘要

  • 小程序
  • 后端api

今日详细

1、数据绑定

  • 基本绑定
  • for循环

双向绑定

创建新目录

pages/telphone/telphone.wxml:(bindinput 前端输入自动触发后端bindPhone函数)

<!--pages/telphone/telphone.wxml-->
<view>手机号:</view>
<input value="{{phone}}" bindinput="bindPhone" placeholder="请输入手机号"></input>

telphone.wxss:(给input框设置个颜色)

/* pages/telphone/telphone.wxss */

input{
  border: 1rpx solid #ddd;
}

telphone.js:(和前端wxml的phone进行了数据绑定)

// pages/telphone/telphone.js
Page({

  /**
   * 页面的初始数据
  数据双向绑定
*/ data: { phone:"", },
  bindPhone:function(e){
    this.setData({ phone:e.detail.value});
  },