Question

背景故事

通常我会使用id来操纵元素的默认样式

html:
    <div id="my-div"></div>

stylesheet:
    #my-div { background: white }

在做出反应时，似乎id不在，ref在，但是我没有看到很多有关使用ref进行样式设置的信息。

html:
    <div ref="my-div"></div>

stylesheet:
    ???

问题

如何使用样式表中的引用编辑元素的样式？

Answer 1

您不需要引用来设置div的样式，仍然可以使用id或类！

在此处阅读有关裁判的信息：https://reactjs.org/docs/refs-and-the-dom.html

在此处了解有关组件样式的信息：https://reactjs.org/docs/faq-styling.html

Answer 2

也许您可以只创建CSS样式规则，并根据需要将适当的规则分配给构成y = df['date'].dt.year #added +-1 year (not necessary) miny = y.min() - 1 maxy = y.max() + 2 df1 = pd.DataFrame({'date':pd.date_range(f'{miny}-03-31', f'{maxy}-03-31', freq='A-Mar')}) df1['year'] = df1['date'].dt.year + 1 print (df1) date year 0 1993-03-31 1994 1 1994-03-31 1995 2 1995-03-31 1996 3 1996-03-31 1997 4 1997-03-31 1998 5 1998-03-31 1999 6 1999-03-31 2000 df = pd.merge_asof(df,df1,on='date') print (df) date year 0 1994-12-15 1995 1 1995-07-06 1996 2 1995-09-13 1996 3 1995-12-12 1996 4 1996-03-14 1996 5 1996-07-01 1997 6 1996-09-17 1997 7 1996-12-12 1997 8 1996-12-13 1997 9 1997-06-25 1998 10 1997-09-10 1998 11 1997-12-12 1998组件的语义元素？

例如：

反应代码：

React

CSS规则：

<div className="custom">
  <p>My test paragraph</p>
</div>

React中不能使用.custom { // add your styling here }特定语言的关键字，而不是HTML中的class关键字，因为在React中不能使用任何className种特定的语言关键字。

希望有帮助！

使用ref代替id反应CSS

2 个答案: