react native 的button点击变色以及禁用问题

一、场景

首先，要实现的目标是：
1、点击button，改变button按钮的颜色，并且保持变色状态
2、点击button之后，无法再重复点击

二、实现方法

1、既然是要改变button的颜色，那一定要有样式。我们需要在原有样式的基础上，增加一个变量’kai’，它的值只能为true或者false，方便我们进行三元运算，实现改变背景色的目的

2、具体怎么在原有的样式基础上实现变色呢，请看下面的:

解释：首先是view中已经有样式了，我们需要在原有的样式中加上背景色。就像图中的这种样式，用‘,’隔开即可，然后就是判断变量’kai’的值。是true的话，就显示红色，不是true的话，就没有背景色。

3、接下来就是button处的写法

解释：
（1）Button的禁用属性是disabled属性，如果disabled=true的话，就会禁用按钮。如果是false的话，按钮就能正常点击。

（2）由于我们设置变量’kai’的初始值是false，因此，刚开始是可以点击按钮的。等点击之后，我们改变’kai’，把它变成true，就能实现禁用按钮的目的

（3）onPress是我们点击之后要进行的逻辑操作，括号里面是我们要传给服务器的值，暂且不理它

4、点击按钮，执行changeOpen()方法，如下：

解释：
（1）我们这边只需要把‘kai’的原始值改变成相反的即可
（2）console.log是为了查看有没有执行这个方法

5、实现效果：

这样就OK了，点击之后变成红色，并且不能重复点击

      以上就是要实现的效果。中间可以考虑加上弹框之类的。这个方法可能比较笨，不过也算是达到了目的。

end