微信小程序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 小时前
基于开源AI大模型AI智能名片S2B2C商城小程序的参与感构建研究
人工智能·小程序·开源
清风细雨_林木木4 小时前
uni-app 和 uni-app x 的区别
uni-app
iOS阿玮4 小时前
期待iOS开发者加入,共同抵制“苹果税”反垄断招募令!
uni-app·app·apple
普通网友4 小时前
支持二次开发的代练App源码:订单管理、代练监控、安全护航功能齐全,一站式解决代练护航平台源码(PHP+ Uni-app)
安全·uni-app·php
蜕变菜鸟4 小时前
uview使用u-popup组件当开启遮罩层禁止下层页面滚动。uniapp弹框禁止页面上下滚动。
uni-app
毕设源码-邱学长18 小时前
【开题答辩全过程】以 基于微信小程序的宠物领养系统为例,包含答辩的问题和答案
微信小程序·小程序·宠物
canglingyue18 小时前
微信小程序日历事件添加实现
微信小程序·小程序
毕设源码-邱学长1 天前
【开题答辩全过程】以 基于微信小程序校园综合服务平台的设计与实现为例,包含答辩的问题和答案
微信小程序·小程序
Thetimezipsby1 天前
基于Taro4打造的一款最新版微信小程序、H5的多端开发简单模板
前端·javascript·微信小程序·typescript·html5·taro
從南走到北1 天前
JAVA同城打车小程序APP打车顺风车滴滴车跑腿源码微信小程序打车源码
java·开发语言·微信·微信小程序·小程序