Question

我需要在React Native上缩进段落的第一行。但是使用公共css text-indent属性（textIndent）与React Native不兼容，也不是伪元素选择器（如:first-line）。有没有办法在没有将整行包装在<Text>标签中并定义自己的风格的情况下这样做？从一个设备的视口到另一个设备的视口，哪个词最终会出现在段落的第一行中。

Answer 1

使用{'\t'}。像这样： <Text>{'\t'}Hi there</Text>

Answer 2

我能够使用以下语法在我的React Web应用程序中使用文本缩进：

//info.js

import './App.css'

export default class Info extends React.Component {
    static defaultProps = {
        history: {
          goBack: () => { }
        }
    }

    render() {
        return (
        <div>
          <Nav />
          <div id='info'>
          <h2>Info</h2>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
          </div>
       </div>
        );
    }
}

//App.css

div#info p {
  text-indent: 20px;
}

React Native上的文本缩进

2 个答案: