javascript - React.js 从函数返回样式属性并在 render() 函数中使用它

Question

我正在尝试使用动态样式属性。下面的方法向我抛出一个“style”属性需要从样式属性到值的映射，而不是字符串”错误。

class someClass extends React.Component {
    someFunction = () => {
        return {marginLeft : 20 };
    }
    render() {
        return( <div style={this.someFunction}/>
        );
    }
}

但是这个有效:

class someClass extends React.Component {
    render() {
        return( <div style={{marginLeft : 20}}/>
        );
    }
}

为什么会这样以及如何从函数返回样式对象？

感谢您的提前答复!

Answer 1

您没有调用样式 Prop JSX 内的函数。像 this.someFunction() 一样调用它，然后它将返回您在 someFunction 中保存的样式对象。

return <div style={this.someFunction()} />