wxml

 <button class='yes-orders' style='{{status_css}}' bindtap='clickExpress'>
{{statusOrders}}
</button>

js

 Page({

   /**
* 页面的初始数据
*/
data: {
isactive: true
},
/**
* 确定接单/取消接单
*/
clickExpress(e) {
let page = this;
page.data.isactive ? page.setData({
statusOrders: '取消接单',
status_css: 'background-color:#FD0100;'
}) : page.setData({
statusOrders: '确定接单',
status_css: 'background-color:#00B100;'
})
page.data.isactive = !page.data.isactive
}
})

微信小程序 - 更改button状态的更多相关文章

  1. 微信小程序的button按钮设置宽度无效

    亲,你是不是也遇到了微信小程序的button按钮设置宽度无效.让我来告诉你怎么弄 方法1. 样式中加入!important,即:width: 100% !important; wxss代码示例 1 2 ...

  2. 微信小程序去除button按钮的边框

    小程序开发记录 小程序开发中, 有时候我们希望button不要有边框, 需要使用button::after来实现, 具体如下: .operations button::after{border:0 n ...

  3. 微信小程序去除Button默认样式

    在小程序开发过程中,使用率蛮高的组件button,因为经常要去除默认样式,然后再自定义样式,所以经常写,自己也总结分享一下简单的实现步骤. (一)实现效果1.实现前(默认样式): 2.实现后(去除默认 ...

  4. 微信小程序中button去除默认的边框

    button { position:relative; display:block; margin-left:auto; margin-right:auto; padding-left:14px; p ...

  5. 微信小程序 - 更改radio和checkbox选中样式

    点击下载源码:示例-更改radio或checkbox选中样式

  6. 微信小程序 --- 获取网络状态

    获取网络状态:wx.getNetworkType btnclick:function(){ wx.getNetworkType({ success:function(res){ console.log ...

  7. 微信小程序组件button

    表单组件button:官方文档 Demo Code: var types=['default', 'primary', 'warn']; var pageObject = { data: { defa ...

  8. 微信小程序的button去边框

    wxml <button class='niu'>123123</button> css niu::after{ border:none; }

  9. 微信小程序取消button边框线

    先给button定义个class属性 <button class="an"> 按钮 </button> 然后再css上加上 .an::after { bor ...

随机推荐

  1. Selenium2+python自动化49-判断文本(text_to_be_present_in_element)【转载】

    前言 在做结果判断的时候,经常想判断某个元素中是否存在指定的文本,如登录后判断页面中是账号是否是该用户的用户名. 在前面的登录案例中,写了一个简单的方法,但不是公用的,在EC模块有个方法是可以专门用来 ...

  2. jQuery 特殊选择器this

    特殊选择器this 相信很多刚接触jQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢? this是JavaScript中的关键字,指的是当前的上下文对象,简单的 ...

  3. hdu4240 求一条流量最大的路/(此题网上百分之90以上算法是错误的)

    题意:求最大流/一条流量最大的路的流量.(此题HDU上数据水,下面俩种错误的都能过....) 思路1;每次增广的时候更新流量,保存最大的那条.  错误性:每次更新,有可能最大的那条流量是前几次已经增广 ...

  4. MATLAB作图方法与技巧(一)

    下面从折线图.曲面图和图形说明与定制三个方面说明MATLAB作图的一些方法与技巧,注意,文中出现的单引号在MATLAB中实际运行的时候,需要改为MATLAB认可的单引号. 一. 作折线图 1.plot ...

  5. docker1.13新功能上要关注的点

    如果要作单点端口映射,则需要结合constraint和label来定位具体的proxy机器吧. 如果不用这种模式,,ingress确实又太浪费集群端口了.. 纠结,,看看如何和compose v3作很 ...

  6. POJ 3553 Task schedule【拓扑排序 + 优先队列 / 贪心】

    Task schedule Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 515 Accepted: 309 Special J ...

  7. java 中==符号的坑

    在某技术群看到这样的一个面试题目: 这是一个4年经验的java 从业者的答案. 你的答案是什么呢? 正确的答案是true. 为什么? 其实当使用String a="a"+" ...

  8. XAMPP 下apache部署网站,多个虚拟机(空间)配置

    1.首先修改C盘WINDOWS/system32/drivers/etc目录下的 hosts 文件,用记事本打开,加入: 127.0.0.1 www.a.com 127.0.0.1 www.b.com ...

  9. kill -3 获取threaddump信息

    有些Java应用服务器是在控制台上运行,如Weblogic,为了方便获取threaddump信息,在weblogic启动的时候,会将其标准输出重 定向到一个文件,用"nohup ./star ...

  10. Vue 单页应用:记事本

    若文章中存在内容无法加载的情况,请移步作者其他博客. 简书 CSDN 最近在看 Vue 的时候,别人给我安利了一个国外的小案例,通过 Vue 和 Vuex 来实现一个记事本. 仔细剖析下,发现“麻雀虽 ...