如何在react native中更改下划线粗细
在React Native中更改下划线的粗细可以通过修改TextInput组件的样式来实现。下面是一种实现方式：
- 首先，在你的React Native项目中找到需要更改下划线粗细的TextInput组件。
- 在该组件的样式中，添加一个新的属性
borderBottomWidth来控制下划线的粗细。例如，你可以将borderBottomWidth设置为2来增加下划线的粗细。 - 在该组件的样式中，添加一个新的属性
borderBottomWidth来控制下划线的粗细。例如，你可以将borderBottomWidth设置为2来增加下划线的粗细。 - 你可以根据需要调整
borderBottomWidth的值来改变下划线的粗细。 - 如果你想要改变下划线的颜色，可以使用
borderBottomColor属性。例如，你可以将borderBottomColor设置为'red'来改变下划线的颜色。 - 如果你想要改变下划线的颜色，可以使用
borderBottomColor属性。例如，你可以将borderBottomColor设置为'red'来改变下划线的颜色。 - 同样地，你可以根据需要调整
borderBottomColor的值来改变下划线的颜色。
这样，你就可以在React Native中更改TextInput组件下划线的粗细了。请注意，以上只是一种实现方式，你可以根据具体需求和项目的样式要求进行调整。
推荐的腾讯云相关产品：无
参考链接：
- React Native官方文档：https://reactnative.dev/docs/textinput
相关·内容
3回答
默认下划线在React本机的TextInput中不可见
react-native、textinput
我对本机开发的反应是新的。在我的应用程序中，我有登录页面，在这个登录页面中有两个文本输入。在这个文本中，输入没有加下划线。我已经尝试了很多方法，但没有得到下划线。这里我的要求是需要对inputtext加下划线。那么，如何得到这条下划线呢？
这是我的登录表单代码。
import React, {Component} from 'react';
import {StyleSheet, Text, View,TextInput,TouchableOpacity} from 'react-native';
export default class App extend
浏览 0提问于2018-09-27得票数 8
2回答
在react原生中存储使用输入文本时出现问题
javascript、css、reactjs、react-native
我试图存储用户输入的颜色值和字体大小，但我的程序不存储该值，它会在用户输入文本时立即更改它。我想它改变字体和背景颜色时，‘按我’被点击。这是目前为止我所做的： import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, TextInput, Button, TouchableOpacity, Alert } from 'react-native';
function Input(props) {
return (
<TextInput
浏览 22提问于2020-10-19得票数 2
回答已采纳
1回答
无法在react本机中添加边框底部
react-native
我在试着做一张登记表。
我在组件目录下创建了一个名为Regform.js的文件。
我无法获取文本注册的边框底部
这是演示链接
请告诉我，我哪里做错了？
组件/Regform.js
import * as React from 'react';
import {
Text,
View,
StyleSheet,
TextInput,
TouchableOpacity
} from 'react-native';
export default class Regform extends React
浏览 0提问于2018-08-22得票数 40
回答已采纳
2回答
自定义组件中的道具React native + Typescript
typescript、react-native、react-native-android、react-native-textinput、react-native-component
我在访问自定义组件中的onChangeText时遇到了问题。下面是我的组件的代码： import React from 'react';
import {TextInput, StyleSheet} from 'react-native';
type Props=
{
style:any
}
const Input = (props:Props) =>
{
return <TextInput {...props} style = {{...styles.input, ...props.style}} blurOnSubmi
浏览 39提问于2021-01-21得票数 0
1回答
react本机自定义TextInput onchangeText不工作
reactjs、react-native
这是我的模板代码
import React, {Component} from 'react';
import {TextInput, View, Text,} from 'react-native';
const InputT = ({ label , inputvalue, ipOnChangeText, placeholder , secureTextEntry}) => {
const {inputStyle, labelStyle, containerStyle} = styles;
return(
<Vi
浏览 0提问于2017-08-31得票数 3
2回答
当文本输入为空时，使用onPress更改按钮颜色
react-native、button、colors、styles、onpress
我刚开始学习，所以我尝试更改教程代码中的一些行。这是一个表单，它添加了新的标题，但是如果值为=== "“，我希望更改按钮的颜色。我试图找到，但大多数示例使用类，在这个项目中，我想使用函数。
import React, { useState } from 'react'
import { View, StyleSheet, TextInput, Button, Alert } from 'react-native'
export const AddTodo = ({ onSubmit }) => {
const [value, setValue
浏览 2提问于2020-02-23得票数 0
回答已采纳
1回答
React Native，如何在选中时更改TextInputField的BottomborderColor？
javascript、react-native、textinput
我想创建一个SignIn屏幕，当用户选择它并开始键入颜色'#FFCC00‘时，来自TextInput的bottomBorder的颜色会发生变化。有没有人可以帮我解决这个问题，告诉我应该在代码中添加什么？这也是很好的，如果有人可以留下一个链接，如何连接和设置一个完整的身份验证系统。那就太好了，因为我找不到任何有效的方法：
import React from 'react';
import {
StyleSheet,
Text,
View,
StatusBar,
TouchableOpacity,
TextInput,
selectionCo
浏览 10提问于2020-02-05得票数 0
1回答
在单击按钮和占位符时响应输入的本机更新值。
reactjs、react-native
我正在尝试通过单击按钮获取纬度和经度，并将其设置为TextInput。下面代码的问题是占位符总是未定义的。
我尝试删除value属性，在这种情况下占位符是可见的，但是我无法设置位置。如何在获取位置之前使占位符可见，然后将位置设置为纬度。
我想我没有正确地使用setLatLong。我们可以使用useRef正确地设置值吗？
<TextInput
style={{
borderBottomColor: "black",
borderBottomWidth: 2,
color: "black",
}}
place
浏览 3提问于2021-04-25得票数 0
回答已采纳
5回答
图像渲染问题React Native
javascript、android、css、react-native
我正在使用模拟数据构建一个react原生应用程序。我可以在平面列表中渲染一些模拟数据，但图像不会渲染。在react原生devtools中，它显示了图像的url，但是没有显示任何样式，即使我在style have元素中有样式。
import React, { Component } from "react";
import { StyleSheet, Text, View, Image, ListView } from "react-native";
class BookItem extends Component {
render(){
浏览 0提问于2018-01-04得票数 0
1回答
反应自然的动态颜色
javascript、react-native、reactjs、jsx
我是新来的反应本地人。我想在选择的基础上创建我的应用程序的动态颜色。
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, {
AppRegistry,
Component,
StyleSheet,
Text,
Image,
NavigatorIOS,
AlertIOS,
ListView,
ScrollView,
TouchableHighlight,
Vi
浏览 3提问于2016-05-05得票数 2
回答已采纳
1回答
如何使键盘避免在本机反应中正确查看
react-native
问题：
我已经创建了一个使用键盘避免视图的react本机表单，但是当显示了输入字段的所有错误消息时，视图并没有回避键盘。这是我的密码。
import React, { useEffect } from "react";
import {
Text,
View,
BackHandler,
KeyboardAvoidingView,
TouchableOpacity,
TextInput,
} from "react-native";
import Icon from "react-native-vector-icons/FontAw
浏览 2提问于2020-05-17得票数 0
1回答
function本机中的删除函数
react-native
我正在为一个简单的注释列表编写代码，我不知道如何从我的“注释列表”中删除一个项目--我添加了一个delete按钮，但是我缺少了使它能够实际做一些事情的功能。这是代码：
import { ScrollView, StyleSheet, Text, View, Button} from 'react-native';
import PropTypes from 'prop-types';
import React from 'react';
export default class CommentList extends React.Compo
浏览 0提问于2021-11-06得票数 0
回答已采纳
2回答
如何在react本机中实现所需的UI
react-native、react-native-stylesheet
我正试图实现如下所示的样式
看看这里指纹图标是如何碰巧在Textinput字段的边框内的，但是我得到的输出如下所示
PS:-忽略左侧和右侧的黑色边框，它恰好是模拟器的主体，只关注UI。
这是我的密码:-
import { View, Text, TextInput, StyleSheet } from 'react-native'
import React from 'react'
import Icon from 'react-native-vector-icons/MaterialCommunityIcons'
cons
浏览 3提问于2022-11-28得票数 0
2回答
React原生表单设计
react-native
我想在react native中创建具有材料输入文本的表单。与此处所示的相同
以下是我的代码
import React, { Component } from "react";
import { Platform, StyleSheet, Text, View, TextInput } from "react-
native";
export default class App extends Component<Props> {
render() {
return
浏览 6提问于2018-12-03得票数 0
1回答
TextInput不工作于react本机，我正在使用它与堆栈导航
android、react-native、react-navigation
因此，我试图创建一个OTP身份验证流程。我在phoneInput屏幕上输入，然后移到OTP验证屏幕。在OTPvercification上，我的textInput无法工作。
App.js
import * as React from 'react'
import { Button, View, Text } from 'react-native'
import { NavigationContainer } from '@react-navigation/native'
import { createStackNavigator } from &#
浏览 2提问于2021-02-11得票数 1
1回答
如何将自定义的"Note“组件呈现到我的react本地应用程序中的App.js滚动视图中？
react-native、expo
App.js
import * as React from 'react';
import {
Text,
View,
StyleSheet,
TextInput,
ScrollView,
TouchableOpacity,
} from 'react-native';
import { Constants } from 'expo';
import Note from './components/Note';
export default class App extends React.Componen
浏览 0提问于2019-01-24得票数 0
回答已采纳
2回答
反应本机登入表格
reactjs、react-native
我正在尝试使用功能组件在React中创建登录页面。但这是行不通的。一旦输入任何文本抛出错误。价值是不变的。
import React from "react";
import { View, Button, Text } from "react-native";
import Inputs from "../../utils/Form/Input";
const LoginForm = () => {
const [formData, setForm] = React.useState({
email: {
value:
浏览 1提问于2020-02-03得票数 0
回答已采纳
1回答
响应本机TouchableOpacity onPress不使用Android构建(APK)
react-native、button、mobile、cross-platform、touchableopacity
TouchableOpacity在安卓仿真器和手机上工作，但是当我生成APK时，TouchableOpacity不再工作了。
会发生什么事？
当我点击TouchableOpacity什么都不会发生，它只会使不透明动画
正确的做法是进入主屏幕，但它没有
上面有z指数之类的东西吗？
Javascript代码Bellow
import React from 'react';
import {View, Image, Text, TouchableOpacity, TextInput} from 'react-native';
import {useNavigation
浏览 0提问于2020-06-01得票数 1
1回答
如何更改<DatePicker />组件的颜色？
material-ui、material-ui-x
我想更改DatePicker组件的下划线颜色。以下是我这样做的尝试
import React from 'react'
import PropTypes from 'prop-types'
import { DatePicker as MuiDatePicker, MuiPickersUtilsProvider } from '@material-ui/pickers'
import { makeStyles } from '@material-ui/core/styles'
import DateFnsUtils fr
浏览 1提问于2021-06-23得票数 1
2回答
用户输入验证不能正常工作。
javascript、react-native
我正试图在我的ReactNative应用程序中制作一个组件，在这个组件中，用户只能提供数字作为输入，但是我的JavaScript reg表达式不能正常工作。我使用来管理状态。我试图只验证用户输入的数字，但输入文本字段也将数字替换为空字符串。所述组件的代码正在折叠；
import React, { useState } from 'react';
import { StyleSheet, Text, View, TextInput, Button, TouchableOpacity } from 'react-native';
import Card from &
浏览 4提问于2020-04-04得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
