Javascript 将数字传递给组件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29474673/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 03:25:06  来源:igfitidea点击:

Passing a number to a component

javascriptreactjs

提问by VitalyB

I am trying to pass a number to a React component but it is getting parsed as string (jsfiddle). How do I make React understand that I am passing a number? Should I cast the string to a number in the component?

我正在尝试将一个数字传递给 React 组件,但它被解析为字符串(jsfiddle)。我如何让 React 理解我正在传递一个数字?我应该将字符串转换为组件中的数字吗?

var Rectangle = React.createClass({
   
    render: function() {

        return <div>
            <div>{this.props.intValue + 10}</div>
            <div>{this.props.stringValue + 10}</div>
        </div>;
    }
});
 
React.render(<Rectangle intValue="10" stringValue="Hello" />
    , document.getElementById('container'));
<script src="https://facebook.github.io/react/js/jsfiddle-integration.js"></script>

<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

回答by VitalyB

It seems that in case of integers (and actually for strings as well) I should be passing the numbers via {}like so:

似乎在整数(实际上也是字符串)的情况下,我应该{}像这样传递数字:

React.render(<Rectangle intValue={10} stringValue={"Hello"} />, document.getElementById('container'));

React.render(<Rectangle intValue={10} stringValue={"Hello"} />, document.getElementById('container'));