React与CSS的一些总结

1. 使<a><a/>标签不可用

<a href="#" class="disabled-link">标签</a>
// 将标签置灰并禁用了点击事件,将光标样式设置为默认（"cursor: default"）
.disabled-link {
  color: gray;
  pointer-events: none;
  cursor: default;
}

 2. React中样式根据条件进行判断

// jsx
import React from 'react';

function MyComponent() {
  const condition = true; // 替换为您自己的条件

  return (
    <div>
      <span
        style={{
          color: condition ? 'red' : 'blue',
          fontSize: condition && 20,
          fontWeight: condition ? 'bold' : 'normal'
        }}
      >
        文本内容
      </span>
         

          <span className={applyStyle ? ${myStyle} : ''}>文本内容</span>
       
    </div>
  );
}

export default MyComponent;

styles={{}} : 第一对大括号用于表示我们正在嵌入JavaScript表达式，而第二对大括号用于表示我们正在创建一个对象。