微信小程序uni-app:常用Form表单组件使用示例

目录

    • [input 输入框](#input 输入框)
    • [picker 选择器](#picker 选择器)

input 输入框

html 复制代码
<input
  class="input-class"
  type="text"
  v-model="value"
  placeholder-class="placeholder-class"
  placeholder="请输入"
/>

picker 选择器

html 复制代码
<picker
  @change="handleChange"
  :value="index"
  range-key="label"
  :range="options"
>
  <view>{{ options[index]?.label }}</view>
</picker>
js 复制代码
{
    data(){
        return {
            index: 0,

            options: [
              {
                value: 1,
                label: '顺丰',
              },
              {
                value: 2,
                label: '圆通',
              },
            ]
        }
    },

    methods: {
        handleChange(e) {
            this.index = e.detail.value
        }
    }
}
相关推荐
曲江涛1 小时前
微信小程序 webview 定位 并返回
微信小程序·小程序
weixin_440470501 小时前
部署Dify接入微信验证反代根目录创建一个文件通过微信小程序验证
微信小程序·腾讯云
27669582923 小时前
美团民宿 mtgsig 小程序 mtgsig1.2 分析
java·python·小程序·美团·mtgsig·mtgsig1.2·美团民宿
web_Hsir3 小时前
uniapp 微信小程序 使用ucharts
微信小程序·小程序·uni-app
web_Hsir3 小时前
Uniapp 实现微信小程序滑动面板功能详解
vue.js·微信小程序·uni-app
fakaifa5 小时前
beikeshop多商户跨境电商独立站最新版v1.6.0版本源码
前端·小程序·uni-app·php·beikeshop多商户·beikeshop跨境电商
Angus-zoe5 小时前
微信小程序唤起app
微信小程序·小程序
不老刘6 小时前
微信小程序使用 Vant Weapp 组件库教程
微信小程序·小程序·vant
橘猫云计算机设计6 小时前
基于springboot微信小程序的旅游攻略系统(源码+lw+部署文档+讲解),源码可白嫖!
java·spring boot·后端·微信小程序·毕业设计·旅游
Mr.Liu67 小时前
小程序30-wxml语法-声明和绑定数据
前端·微信小程序·小程序