React-Native填坑之TextInput value属性

 TextInput用法就不多讲了,主要记录下遇到的一个怪问题。


    背景:项目需要开发一个充值页面,需要一个输入框,然后几个按钮,输入框是允许用户自己输入任意金额,按钮是可以让用户快捷选择金额。

    那么问题来了,一般来说是改变文本框的值就可以了。

    比如这样
<TextInputplaceholderTextColor='#cccccc'underlineColorAndroid='transparent'keyboardType={'numeric'}style={styles.inputStyle}value ={this.state.money}onChangeText={(text)=>this.changeMoney(text)}
/>
 
然后在其他需要改变value值的地方,这样写
 
checkMoney(text) {this.setState({money: text});
}
乐观的情况是:我可以点击按钮可以改变文本框的值,也可以用户自己输入,
但是,但是,但是,重点来了,它根本不让你输入,光标一直闪烁。
看了文档,给的解释是:
	TextInput是一个受约束的(Controlled)的组件,意味着如果提供了value属性,原生值会被强制与value属性保持一致。在大部分情况下这都工作的很好,
	不过有些情况下会导致一些闪烁现象——一个常见的原因就是通过不改变value来阻止用户进行编辑。如果你希望阻止用户输入,
	可以考虑设置editable={false};如果你是希望限制输入的长度,可以考虑设置maxLength属性,这两个属性都不会导致闪烁。
然而加上没有什么卵用。
 
无奈只有再去找看看有没有什么可用的属性,没想到被我找到了,激动的要写一篇文章来记录下。
 

提供一个文本框中的初始值。当用户开始输入的时候,值就可以改变。

在一些简单的使用情形下,如果你不想用监听消息然后更新value属性的方法来保持属性和状态同步的时候,就可以用defaultValue来代替。

描述的还是云里雾里的,但是用defaultValue来代替value就能完美完成我的期望了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/419359.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Spring的特点

Spring框架Spring框架是一个分层架构,有7个定义良好的模块组成spring模块构建在核心容器智之上, 核心容器定义了创建、 配置、和管理bean的方式组成spring框架的每个模块(或组件)都可以单独存在, 或者与其他一个或多个模块联合实现 模块如下: 1--核心容器 核心容器提供spring框…

MySQL对一行多列求和

SUM函数的语法是&#xff1a; SELECT SUM(expression ) FROM tables WHERE predicates; 表达式可以是一个数值字段或公式。 SELECT column1 column1 column1 …… column1 AS Total FROM table

mybatis判断集合为空或者元素个数为零

mybatis判断集合为空或者元素个数为零&#xff1a; <if test"mlhs ! null and mlhs.size() ! 0">and t.mlh_name not in <foreach collection"mlhs" item"item1" open"(" close")" index"i" separator&…

React-Native 填坑之ListView(item更新)

一 背景 效果图如下&#xff1a;二 解决办法 我的目的是实现单选item&#xff0c;正常情况设置一个state变量来保存选中的Index,在每次点击item的时候改变index就OK&#xff01;但是&#xff0c;我想的太天真了。this.setState()只能渲染外部组件&#xff0c;而ListView子组件…

锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]

1.表单验证插件Validation2.表单插件Form3.动态事件绑定插件livequery可以为后来的元素绑定事件类似于jQuery中的live()方法4.jQuery UI5.jQuery Cookie6.遮罩层插件:thickbox7.编写jQuery插件<1>编写插件的目的&#xff1a;给已经有的一些列方法或函数做一个封装&#x…

Java中的注解以及应用 @Deprecated @SupressWarning @Override

Annotation注解在 Java 中有着很广泛的,他是做为一种标识 为javac所识别,。每一个注解 都对应这一个Java类 在java.lang包中 有三个注解 分别是Deprecated SuppressWarning Override 在使用 注解前必须要在 注解类前面加上 每增加一个注解 就意味着产生了一个注解…

React Native 实现物流进度信息

1.实现效果 2.直接上代码 use strict; import React, {Component} from react; import {View, StyleSheet, Text, Dimensions} from react-native export default class Button extends Component {render() {let invoice [{id: 111, content: 已签收,签收人&#xff1a;门…

String中intern的方法

intern public String intern() 返回字符串对象的规范化表示形式。 一个初始时为空的字符串池&#xff0c;它由类 String 私有地维护。 当调用 intern 方法时&#xff0c;如果池已经包含一个等于此 String 对象的字符串&#xff08;该对象由 equals(Object) 方法确定&#xff0…

iOS开发学习-nonatomic和atomic的区别

nonatomic是非原子性的&#xff0c;也就是给线程不加原子锁&#xff0c;这样的代码运行效率会更高一点&#xff0c;例如&#xff1a; property (nonatomic,copy)NSString *userName; property (atomic,copy)NSString *userName; nonatomic能提高好几倍的效率&#xff0c;所以在…

Vue创建递归树组件(点击可展开关闭)

本篇文章借鉴于此处&#xff0c;如果只需显示树形组件&#xff0c;可以直接访问该博主文章。我这里对他的组件做了扩展&#xff0c;增加了点击展开和关闭操作&#xff0c;话不多说上代码。 1.数据结构 const data {label: 根目录,children: [{label: 目录A,children: [// 叶…

【Java线程】锁机制:synchronized、Lock、Condition

转载声明&#xff1a;转载自&#xff1a;点击打开链接http://blog.csdn.net/vking_wang/article/details/9952063非常感谢博主的讲解&#xff0c;对锁这一块又加深了理解http://www.infoq.com/cn/articles/java-memory-model-5 深入理解Java内存模型&#xff08;五&#xff09…

linux 进程线程拓展

依次参考&#xff1a; 多线程和多进程的区别&#xff08;小结&#xff09; Linux内核源代码分析——fork()原理&多进程网络模型 Linux写时拷贝技术(copy-on-write) linux内核 do_fork 函数源代码浅析 转载于:https://www.cnblogs.com/mylinux/p/4947103.html

“睡服”面试官系列第五篇之proxy(建议收藏学习)

目录 1. 概述 2. Proxy 实例的方法 2.1get() 2.2set() 2.3apply() 2.4has() 2.5construct() 2.7deleteProperty() 2.8defineProperty() 2.9getOwnPropertyDescriptor() 2.10getPrototypeOf() 2.11isExtensible() 2.12ownKeys() 2.13preventExtensions() 2.14set…