JSS设置RGB backgroundColor

Question

如果我具有通过redux状态获取的RGB值，如何使用这些值通过JSS设置元素的背景色？

<?php

$curl = curl_init();
curl_setopt_array($curl, array(
  CURLOPT_URL => "http://stats.nba.com/stats/scoreboardV2?Season=2017-18&LeagueID=00&GameDate=10/17/2017&dayoffset=0",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "GET"
));

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}

Answer 1

使用CSS创建一个对象，其键为css属性名称和值，如下所示。

请记住，对象名称不能包含破折号，因此您需要将background-color之类的驼峰式属性变成backgroundColor

在CodeSandBox上工作的演示<​​/ h2>

let style = {
	color: "rgb(255, 0, 0)",
	backgroundColor: "rgb(255, 255, 0)"
}

class TodoApp extends React.Component {
 
  render() {
    return (
      <div>
        <div style={style}>asdf</div>
      </div>
    )
  }
}

ReactDOM.render(<TodoApp />, document.querySelector("#app"))

如果要使用styled-components，则可以照原样复制和粘贴CSS。

import React from 'react';
import styled from 'styled-components';

const Content = styled.div`
  color: rgb(255, 0, 0);
  background-color: rgb(255, 255, 0);
`

class TodoApp extends React.Component {
 
  render() {
    return (
      <div>
        <Content>asdf</Content>
      </div>
    )
  }
}

ReactDOM.render(<TodoApp />, document.querySelector("#app"))

<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>