ES6新增的不少语法都是极好用的，

在拼接变量与字符串时，模版字符串``就是典型的用法

以下是2种写法

 <div className={"bubble-box" +' '+`${item.class}`} key={index} style={{left:`${item.left}px`,top:`${item.top}px`}}><img className={`${item.class}`} src={item.src} /></div>

 <div className={"bubble-box" +' '+(item.class)} key={index} style={{left:`${item.left}px`,top:`${item.top}px`}}><img className={`${item.class}`} src={item.src} /></div>

react className的2种变量写法的更多相关文章

  1. 总结 React 组件的三种写法 及最佳实践 [涨经验]

    React 专注于 view 层,组件化则是 React 的基础,也是其核心理念之一,一个完整的应用将由一个个独立的组件拼装而成. 截至目前 React 已经更新到 v15.4.2,由于 ES6 的普 ...

  2. 总结 React 组件的三种写法 及最佳实践

    React 专注于 view 层,组件化则是 React 的基础,也是其核心理念之一,一个完整的应用将由一个个独立的组件拼装而成. 截至目前 React 已经更新到 v15.4.2,由于 ES6 的普 ...

  3. SQL Server 存储过程中处理多个查询条件的几种常见写法分析，我们该用那种写法

    本文出处: http://www.cnblogs.com/wy123/p/5958047.html 最近发现还有不少做开发的小伙伴,在写存储过程的时候,在参考已有的不同的写法时,往往很迷茫,不知道各种 ...

  4. 代码片段--Makefile之大型工程项目子目录Makefile的一种通用写法

    转载:http://blog.csdn.net/mo_hui123456/article/details/8929615 管理Linux环境下的C/C++大型项目,如果有一个智能的Build Syst ...

  5. Makefile之大型工程项目子目录Makefile的一种通用写法

    管理Linux环境下的C/C++大型项目,如果有一个智能的Build System会起到事半功倍的效果,本文描述Linux环境下大型工程项目子目录Makefile的一种通用写法,使用该方法,当该子目录 ...

  6. Makefile之大型工程项目子目录Makefile的一种通用写法【转】

    转自:http://www.cnblogs.com/skyofbitbit/p/3680753.html 管理Linux环境下的C/C++大型项目,如果有一个智能的Build System会起到事半功 ...

  7. SQL Server 存储过程的几种常见写法分析，我们该用那种写法

    本文出处: http://www.cnblogs.com/wy123/p/5958047.html 最近发现还有不少做开发的小伙伴,在写存储过程的时候,在参考已有的不同的写法时,往往很迷茫,不知道各种 ...

  8. js中的三种函数写法

    js中的三种函数写法 <script type="text/javascript"> //普通的声明方式 function myFun(m,n){ alert(m+n) ...

  9. JMeter学习-032-JMeter常见四种变量简介

    在JMeter自动化测试脚本编写过程中,经常需要对测试脚本进行一些参数设置.例如,设置测试计划的全局变量(方便切换不同的测试环境).样本线程(HTTP请求等)的参数传递等. 通常,JMeter中常用的 ...

随机推荐

  1. 《Cracking the Coding Interview》——第17章：普通题——题目13

    2014-04-29 00:15 题目:将二叉搜索树展开成一个双向链表,要求这个链表仍是有序的,而且不能另外分配对象,就地完成. 解法:Leetcode上也有,递归解法. 代码: // 17.13 F ...

  2. iOS笔记059 - 网络总结

    网络 基本概念 客户端:client 服务器:server 请求:request 响应:response 过程 客户端 -> 发送请求 -> 服务器(连接数据库) 服务器 -> 发送 ...

  3. Python全栈工程师（迭代器、字节串）

    ParisGabriel                每天坚持手写  一天一篇  决定坚持几年 为了梦想为了信仰     Python人工智能从入门到精通 迭代器 Iterator: 用<&g ...

  4. CPU指令集不同导致的core分析

    最近程序需要支持CGSL系统运行,测试中发现相同操作系统的两台机器,编译机运行正常,测试机coredump.core信息汇总如下,可以看出是由于测试机不支持编译后的指令导致的问题: Program t ...

  5. [DM8168]Linux下SPI驱动测试

    1.内核自带的SPI相关的驱动文件 项目中有CPU与FPGA进行通信,用到SPI接口: SPI头文件在: linux-kernel/include/linux/spi.h SPI实现在: linux- ...

  6. 《大道至简》第一章 编程的精义 java伪代码形式

    愚公.这位名家身上,浓缩了项目组织者.团队经理.编程人员.技术分析师等众多角色的优秀素质. 愚公移山事件分析: 原始需求:惩山北之塞,出入之迂 项目沟通方式:聚室而某曰 项目目标:毕力平险,指通豫南, ...

  7. ActiveX 控件和 Web 浏览器加载项

    百度ActiveX的概念. 如何从零开始写一个 Chrome 扩展 360极速浏览器应用开发平台.

  8. MPLAB® XC C编译器的Workstation License的获取及安装方法

    MPLAB®XC C编译器的Workstation License获取及安装方法如下:首先需要购买获得一个XC C编译器的激活码,然后到以下网页(http://www.microchip.com/rl ...

  9. BZOJ1483 [HNOI2009]梦幻布丁 【链表 + 启发式合并】

    题目 N个布丁摆成一行,进行M次操作.每次将某个颜色的布丁全部变成另一种颜色的,然后再询问当前一共有多少段颜色. 例如颜色分别为1,2,2,1的四个布丁一共有3段颜色. 输入格式 第一行给出N,M表示 ...

  10. 《c程序设计语言》读书笔记-5.3-指针实现strcat

    #include <stdio.h> #include <math.h> #include <stdlib.h> #include <string.h> ...