reactjs - 将 id 属性插入到由react-emotion创建的样式组件中

Question

使用 react-emotion 作为 React 组件对纯 HTML 元素进行样式化的基本用法如下:

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

const StyledContainer = styled.div`
  display: block;
  box-sizing: border-box;
`;

给定的代码会给我们这样的东西:

<div class="css-gf43fxd ferwf23sd"></div>

我是否可以向生成的 HTML 元素添加 id 属性？提前致谢。

Answer 1

使用该组件时只需添加id属性即可。

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

const StyledContainer = styled.div`
  display: block;
  box-sizing: border-box;
`;

// and when you want to use this component add id attribute

<StyledContainer id="some-id">...</StyledContainer>