Javascript React-native: textAlign: 'right' 样式不正确
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38917002/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
React-native: textAlign: 'right' not styling correctly
提问by dv3
I'm quite new to react-native css-styling.. and have the following code:
我对 react-native css-styling 很陌生.. 并有以下代码：
<Text>
<Text style={(styles.author, { textAlign: "left" })}>
{question.view_count + " views\t" + question.comment_count}
{question.comment_count > 1 || question.comment_count == 0
? " comments"
: " comment"}
</Text>
<Text style={{ textAlign: "right" }}>
{question.solution_count > 0
? question.solution_count + " solutions"
: " Solve this"}
</Text>
</Text>;
The problem is the second "textAlign: 'right' " isn't working - the text is still on the left. I want the text to be on the same line, but (obviously) the second text-object on the right.
问题是第二个“textAlign：'right'”不起作用 - 文本仍在左侧。我希望文本在同一行上，但（显然）右侧的第二个文本对象。
Any hints? thanks!
任何提示？谢谢！
editoutput looks like this:
编辑输出如下所示：
回答by Mihir
I can't confirm right now, but can you try this?
我现在无法确认，但你能试试这个吗？
{textAlign: 'right', alignSelf: 'stretch'}
{textAlign: 'right', alignSelf: 'stretch'}
Let me know if it works.
让我知道它是否有效。
UPDATE
更新
Can I suggest a work-around?
我可以建议一个解决方法吗？
<View style={{flex: 1, flexDirection: 'row'}}>
<View style={{flex: 1}}>
<Text>4 Views 0 Comments</Text>
</View>
<View style={{flex: 1}}>
<Text style={{textAlign: 'right'}}>Solve This</Text>
</View>
</View>
回答by Ramiah Viknesh
Give width 100% to your text tag so that you make sure it stretches it's full width, then give texalign right. This might work.
为您的文本标签提供 100% 的宽度，以便确保它拉伸它的全宽，然后给 texalign right。这可能会奏效。
回答by lachlanvandervelden
I found that because i was using a full width button (already alignSelf: 'stretch') it caused the text content to stretch vertically not horizontally... i found that using flex: 1on the text element instead seemed to work as intended.
Example:
我发现因为我使用的是全宽按钮（已经alignSelf: 'stretch'）它导致文本内容垂直而不是水平拉伸......我发现flex: 1在文本元素上使用似乎可以按预期工作。例子：
finishButtonText: {
textAlign: "center",
flex: 1
} as StyleProp<TextStyle>
with .tsx / .jsx:
使用 .tsx / .jsx：
<Button style={{alignSelf: 'stretch'}}>
<Text style={styles.finishButtonText}>
Test
</Text>
</Button>
回答by amit pandya
you can use below code snippet for aligning your text on right side of view:
您可以使用以下代码片段在视图右侧对齐文本：
<View style={{justifyContent: 'space-between'}}>
<Text style={{alignSelf: 'flex-end'}}> Hello </Text>
</View>
回答by Pir Abdul
style={{marginLeft:'auto' }}
Will works with button, items etc.
将适用于按钮、项目等。
