<分区>
标签 javascript html css reactjs jsx
<分区>
class Test extends React.Component{
state={name: "John", numTimes: 2};
render() {
let output = ""
for (let i = 1; i <= this.state.numTimes; i++) {
let evenOdd = i % 2
if (evenOdd === 0) {
output += i + ". Hello " + this.state.name + "!"
} else {
output += i + ". Hello " + this.state.name
}
}
return <p>{output}</p>
}
}
ReactDOM.render(<Test /> , document.getElementById("react"));<div id="react"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>我正在设置一个应用程序，它将通过输入获取用户名以及他们希望他们的名字显示多少次。
我尝试过设置样式，使用“\n”和断线将我自己的断线添加到输出中。
render() {
let output = ""
for (let i = 1; i <= this.state.numTimes; i++) {
let evenOdd = i % 2
if (evenOdd === 0) {
output += i + ". Hello " + this.state.name + "!"
} else {
output += i + ". Hello " + this.state.name
}
}
return <p>{output}</p>
}
我的 for 循环它会打印出来!在偶数上没有在奇数上，所以如果他们对数字做 2，则期望的结果将是
1. 你好约翰
2. 你好约翰!
等...
我没有收到任何错误，只是输出不正确...
最佳答案
尝试使用 div 作为它的 block 级元素，这样它会自动转到下一行
let output= []
for (let i = 1; i <= this.state.numTimes; i++) {
let evenOdd = i % 2
if (evenOdd === 0) {
output.push(<div key={i}>{i + ". Hello " + this.state.name + "!"}</div>)
} else {
output.push( <div key={i}>{i + ". Hello " + this.state.name}</div>)
}
}
关于javascript - 在我的代码上换行时遇到问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56495950/
相关文章：
javascript - 为什么 <object> 的类型是一个函数？
javascript - 使用 javascript 创建 Accordion 式子菜单
css - Ant Design Tab Pane 最小高度 100%
javascript - 将鼠标悬停在一个元素上，过渡到另一个元素
javascript - 原型(prototype)模式创建新属性
javascript - 将一个数组的每个元素与另一个数组进行比较，找出哪个元素未找到
javascript - HTML:选择多个文件但没有显示文件名？