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

news/2024/7/20 3:21:57 标签: 微信小程序, uni-app, 小程序

目录

    • input 输入框
    • textarea多行输入框
    • picker 选择器

input 输入框

  • https://developers.weixin.qq.com/miniprogram/dev/component/input.html
  • https://uniapp.dcloud.net.cn/component/input.html
<input
  class="input-class"
  type="text"
  v-model="value"
  placeholder-class="placeholder-class"
  placeholder="请输入"
/>

textarea多行输入框

<textarea 
    v-model="value"
	:maxlength="-1"
	placeholder="占位符字体是红色的"
/>

需要注意:默认的长度为140个字符

picker 选择器

  • https://uniapp.dcloud.net.cn/component/picker.html
  • https://developers.weixin.qq.com/miniprogram/dev/component/picker.html
<picker
  @change="handleChange"
  :value="index"
  range-key="label"
  :range="options"
>
  <view>{{ options[index]?.label }}</view>
</picker>
{
    data(){
        return {
            index: 0,

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

    methods: {
        handleChange(e) {
            this.index = e.detail.value
        }
    }
}

http://www.niftyadmin.cn/n/5256237.html

相关文章

awt中文乱码-Intellij IDEA

乱码的根本原因在于秦始皇嘎太早了&#xff08;bushi 解决方法&#xff1a;肉眼可见的编码设置统一为GBK 1.打开设置找到文件编码 2.肉眼可见的编码统统改成GBK 有人该问了&#xff0c;为什么不改成utf-8&#xff0c;因为awt的编码由操作系统决定&#xff0c;我的是win家庭中…

数据结构 | Floyd

参考博文&#xff1a; floyd算法 弗洛伊德算法 多源最短路径算法_弗洛伊德算法例题-CSDN博客

【后端】系统设计类题目汇总五

40 设计一个点赞系统&#xff08;开放设计&#xff1a; 怎么设计表 用什么存储 怎么处理高并发 容错等&#xff09; 设计一个点赞系统需要考虑多个方面&#xff0c;包括数据库设计、存储选择、高并发处理、容错机制等。以下是一个高层次的设计方案&#xff1a; 1. 数据库设计…

HashMap常见面试问题

简述HashMap原理&#xff1f; HashMap基于数组加链表的方式来实现&#xff0c;数组下标通过hash值来计算&#xff0c;当下表冲突时&#xff0c;就会进行遍历链表&#xff0c;当链表长度大于8的时候会转化为红黑树。 HashMap的put过程&#xff1f; put的第一步是计算hash值&a…

SSL证书HTTPS保护服务

SSL证书属于数字证书的其中一种&#xff0c;广泛用于https协议&#xff0c;从而可以让数据传输在加密前提下完成&#xff0c;确保HTTPS网络安全是申请SSL证书必要工作。 SSL证书是主要用于https是一种加密协议&#xff0c;仔细观察网站地址会发现目前主流的网址前面都会有http…

华清远见嵌入式学习——QT——作业3

作业要求: 代码效果图&#xff1a; 登录成功并跳转页面 登录失败 关闭 代码&#xff1a; 第一页面头文件&#xff1a; #ifndef LOGIN_H #define LOGIN_H#include <QWidget> #include <QMessageBox>QT_BEGIN_NAMESPACE namespace Ui { class Login; } QT_END_NAME…

【Netty为什么适合做网络编程】

Netty为什么适合做网络编程 描述优点 描述 Netty是由JBOSS提供的一个Java开源框架。Netty提供异步的、基于事件驱动的网络应用程序框架&#xff0c;用以快速开发高性能、高可靠性的网络IO程序。Netty主要用来做网络通信&#xff0c;一般可以用来做RPC框架的通信工具、实现即时…

计算机速成课Crash Course - 09. 高级CPU设计

今天继续计算机速成课Crash Course的系列讲解。 更多技术文章&#xff0c;全网首发公众号 “摸鱼IT” 锁定 -上午11点 - &#xff0c;感谢大家关注、转发、点赞&#xff01; 计算机速成课Crash Course - 09. 高级CPU设计 09. 高级CPU设计 随着本系列进展&#xff0c;我们知道…