本文主要写一下react的样式写法

react中的{ }语法支持表达式、三目/元，不支持语句如if、for、while

前期准备：在html中引入react的链接：见(https://www.cnblogs.com/z-study/p/15995837.html) 

css样式

代码：

1.基础样式绑定

效果：

接下来代码还是写到element的div里面

2.多个样式绑定

react 错误演示 后面的会覆盖掉前面的
    

    
react 数组的写法
    

    
数组的错误写法
    {
        //这会生成一个新的class:"bgR , bd",我们要思考怎样去掉这个","变成空格
        // arr.join(字符) 已指定的字符链接 分割后的数组元素
    }
                
    
数组的正确使用

结果：

3.运算符绑定

先在js里面声明两个变量

let isActive=true

let bgO="orange"//颜色

三目运算符
     {
         //三目运算符：先判断？前是true或false，true执行":"前的，false执行":"后的
         //短路写法，前面对了才会执行后面的
     }
短路写法

 4.style绑定样式

  
style 绑定
    {
        // style绑定样式 外层{} 表示jsx 识别里面的代码为js
        // style里面那层{}代表一个对象

    }
  
style 绑定

欢迎多多交流。