`style` 属性需要从样式属性到值的映射，而不是字符串答案

【问题标题】：The `style` prop expects a mapping from style properties to values, not a string`style` 属性需要从样式属性到值的映射，而不是字符串
【发布时间】：2018-10-30 05:34:44
【问题描述】：

import React, { Component } from 'react';

class App extends Component {
  render() {
  const name = 'Red Header';
  const styleRed = {backgroundColor : 'red'};
  return (
    <div style="{styleRed}">
      {name}
    </div>
  );
 }
}

export default App;

那是我的代码我正确地编写了样式对象，但反应仍然在争论。为什么会这样它说：

'例如，使用 JSX 时 style={{marginRight:spacing + 'em'}}。'.

我的代码看起来像上面的代码，但 react 认为。

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

尝试从样式道具中删除“”。 https://codesandbox.io/s/6j91o6z56w

import React, { Component } from 'react';

class App extends Component {
  render() {
  const name = 'Red Header';
  const styleRed = {backgroundColor : 'red'};
  return (
    <div style={styleRed}>
      {name}
    </div>
  );
 }
}

【讨论】：

【解决方案2】：

让我们尝试一下，希望这对你有帮助。

import React, { Component } from 'react';


class App extends Component {
  render() {
  const name = 'Red Header';
  const styleRed = {backgroundColor : 'red'};
  return (
    <div style={styleRed}>
      {name}
    </div>
  );
 }
}

export default App;

or 

import React, { Component } from 'react';

class App extends Component {
  render() {
  const name = 'Red Header';

  return (
    <div style={{backgroundColor : 'red'}}>
      {name}
    </div>
  );
 }
}

export default App;

【讨论】：