微信小程序 - 更改button状态

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状态的更多相关文章
- 微信小程序的button按钮设置宽度无效
亲,你是不是也遇到了微信小程序的button按钮设置宽度无效.让我来告诉你怎么弄 方法1. 样式中加入!important,即:width: 100% !important; wxss代码示例 1 2 ...
- 微信小程序去除button按钮的边框
小程序开发记录 小程序开发中, 有时候我们希望button不要有边框, 需要使用button::after来实现, 具体如下: .operations button::after{border:0 n ...
- 微信小程序去除Button默认样式
在小程序开发过程中,使用率蛮高的组件button,因为经常要去除默认样式,然后再自定义样式,所以经常写,自己也总结分享一下简单的实现步骤. (一)实现效果1.实现前(默认样式): 2.实现后(去除默认 ...
- 微信小程序中button去除默认的边框
button { position:relative; display:block; margin-left:auto; margin-right:auto; padding-left:14px; p ...
- 微信小程序 - 更改radio和checkbox选中样式
点击下载源码:示例-更改radio或checkbox选中样式
- 微信小程序 --- 获取网络状态
获取网络状态:wx.getNetworkType btnclick:function(){ wx.getNetworkType({ success:function(res){ console.log ...
- 微信小程序组件button
表单组件button:官方文档 Demo Code: var types=['default', 'primary', 'warn']; var pageObject = { data: { defa ...
- 微信小程序的button去边框
wxml <button class='niu'>123123</button> css niu::after{ border:none; }
- 微信小程序取消button边框线
先给button定义个class属性 <button class="an"> 按钮 </button> 然后再css上加上 .an::after { bor ...
随机推荐
- js加载条
<html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv=" ...
- IOC(控制反转)的理解
1.IOC的理论背景 我们知道在面向对象设计的软件系统中,它的底层都是由N个对象构成的,各个对象之间通过相互合作,最终实现系统地业务逻辑[1]. 图1 软件系统中耦合的对象 如果我们打开机械式手表的后 ...
- (三)mysql数据库基本操作
(1)SQL语句:结构化查询语句 DDL语句 数据定义语言:数据库丶表丶视图丶索引丶存储过程丶函数丶create drop alter DML语句 数据库操作语言:插入数据insert,删除数据del ...
- A - Enterprising Escape 【BFS+优先队列+map】
The Enterprise is surrounded by Klingons! Find the escape route that has the quickest exit time, and ...
- HDU 多校1.12
- python3类方法,实例方法和静态方法
今天简单总结下python的类方法,实例方法,静态方法. python默认都是实例方法,也就是说,只能实例对象才能调用这个方法. 那是不是说类方法也只能被类对象本身来调用呢,当然,不是.类方法既可以被 ...
- 集训考试题tents
题目描述Pb 去郊游啦!他来到一块空地打算在这里搭一个帐篷.但是,帐篷的四个支撑点不能在落在任何位置上,而只能落在一些固定点上.现在,他找到地面上有 N 个点可以支撑帐篷.(四个支撑点必须围成一个矩形 ...
- SPOJ PT07J - Query on a tree III(划分树)
PT07J - Query on a tree III #tree You are given a node-labeled rooted tree with n nodes. Define the ...
- 最小生成树(Kruskal)(并查集)
最小生成树 时间限制: 1 Sec 内存限制: 64 MB提交: 11 解决: 2[提交][状态][讨论版] 题目描述 某个宇宙帝国有N个星球,由于宇宙的空间是三维的,因此每个星球的位置可以用三维 ...
- notepad++ 开始和结尾
作者:zecy链接:https://www.zhihu.com/question/37708379/answer/73181634来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注 ...