uniapp组件-button按钮

川长思鸟来 2021-07-25 14:27 1576阅读 0赞

# 效果图 ： #

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70][]

## 实现代码： ##

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 1][]

<template>
        <view>
    		<button @click="clickBtn">type="default"</button>
    		<button style="width: 70%;color: red;background-color: orange;">自定义样式</button>
    		<button type="primary">type="primary"</button>
    		<button type="warn">type="warn"</button>
    		<button loading="true">loading="true"</button>
    		<button disabled="true">disabled="true"</button>
    		<button plain="true">plain="true"</button>
    
    		<button size="mini">按钮</button>
    		<button type="primary" size="mini">按钮</button>
    		<button type="warn" size="mini">按钮</button>
        </view>
    </template>
    <script>
        export default {
            data() {
                return {}
            },
            methods: {
    			clickBtn(){
    				uni.showToast({
    					title:"点击了按钮"
    				})
    			}
            }
        }
    </script>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70]: /images/20210725/16fb44bc64a1401387f2e4ae9b9c8764.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20210301195608305.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，1576人围观）

还没有评论，来说两句吧...

相关阅读

相关 ExtJS 组件_button按钮配置-属性-方法详解

官方文档：[https://docs.sencha.com/extjs/7.3.0/modern/Ext.html][https_docs.sencha.com_extjs_7

红太狼/ 2022年11月08日 11:59/ 0 赞/ 480 阅读

相关前端 button 组件之按钮式进度条实现

大厂技术高级前端 Node进阶点击上方程序员成长指北，关注公众号回复1，加入高级Node交流群 ![d65ba5e1835cddbe66bd063

谁践踏了优雅/ 2022年09月09日 11:58/ 0 赞/ 135 阅读

相关 LayaAir UI 组件 # Button 按钮

目录 Button 组件详解默认Button资源自定义按钮资源按钮绑定单击事件 Button组件属性介绍 -------------------- 本文使用

电玩女神/ 2022年04月02日 09:55/ 0 赞/ 733 阅读

相关 Android Button：按钮控件

按钮（Button）应该是用户交互中使用最多的组件，在很多应用程序中都很常见。当用户单击按钮的时候，会有相对应的响应动作。下面在 WidgetDemo 工程的主界面

我就是我/ 2021年12月10日 12:07/ 0 赞/ 331 阅读

相关微信小程序按钮 button 组件

[完整微信小程序(Java后端) 技术贴目录清单页面（必看）][Java_] <table> <thead> <tr> <th align="left"

ゝ一世哀愁。/ 2021年09月08日 00:24/ 0 赞/ 538 阅读

相关 uniapp——button按钮组件的使用

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

痛定思痛。/ 2021年07月26日 00:39/ 0 赞/ 1816 阅读

相关 uniapp组件-uni-fav收藏按钮

官方示例：[https://ext.dcloud.net.cn/plugin?id=864][https_ext.dcloud.net.cn_plugin_id_864]

心已赠人/ 2021年07月25日 20:18/ 1 赞/ 684 阅读

相关 uniapp组件-uni-fab悬浮按钮

官网示例：[https://ext.dcloud.net.cn/plugin?id=144][https_ext.dcloud.net.cn_plugin_id_144]

谁借莪１个温暖的怀抱￠/ 2021年07月25日 14:28/ 1 赞/ 2374 阅读

相关 uniapp组件-button按钮

效果图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV

川长思鸟来/ 2021年07月25日 14:27/ 0 赞/ 1577 阅读

相关 uniapp 按钮组件button

属性 type='primary/default/warn' 颜色分别为蓝色/灰白色/红色 size='mini/default' 按钮大小

左手的ㄟ右手/ 2021年07月24日 18:06/ 0 赞/ 1427 阅读