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. APP遇到大量的真实手机号刷注册用户该如何应对？

    欢迎访问网易云社区,了解更多网易技术产品运营经验. 在说如何应对之前,先给各位梳理移动端APP可能遇到哪些作弊风险.1. 渠道商刷量,伪造大量的下载量和装机量,但没有新用户注册:2. 对于电商.P2P ...

  2. gulp批量添加版本号

    要实现的理想效果: "/css/style.css" => "/dist/css/style.css?v=1d87bebe""/js/scrip ...

  3. JMeter学习笔记（六） 文件下载接口测试

    本次测试的是文件下载接口,文件是PDF文档,步骤如下: 1.通过jmeter的录制功能,获取了文件下载接口的地址和参数,和其他的HTTP请求一样的配置 2.执行此接口后,察看结果树,点击下载接口的结果 ...

  4. 1.0 python-client以及ui自动化介绍

     appium的client-----捕获元素和对元素进行操作都是在client里面去写脚本实现的,client会将你写的python脚本发送到appium server上,然后appium serv ...

  5. sql 表数据转移另一张表

     if not exists(select * from syscolumns where id=object_id('REMOTEDETECTION_2018')) begin SELECT * I ...

  6. Ubuntu16.04安装openCV的问题集合

    Q1 下列软件包有未满足的依赖关系:   libtiff4-dev : 依赖: libjpeg-dev  E: 无法修正错误,因为您要求某些软件包保持现状,就是它们破坏了软件包间的依赖关系. 上网查了 ...

  7. CodeForces-999D Equalize the Remainders

    题目链接 https://vjudge.net/problem/CodeForces-999D 题面 Description You are given an array consisting of ...

  8. initialization of 'zf' is skipped by 'case' label原因及解决方法

    原因:switch 的 case 中不能定义变量,不然就会报错.可能是变量的初始化会因为有时候case条件不被执行而跳过. 解决方法: 1:在case中用{}将代码括起来,这样在{}中就能定义变量了; ...

  9. leetcode_day02

    任务二:删除排序数组中的重复项 原文链接:https://leetcode-cn.com/problems/remove-duplicates-from-sorted-array/ 最开始的解决思路: ...

  10. 201621123033 《Java程序设计》第2周学习总结

    1. 本周学习总结 ·学习了String类的特点,以及其与字符数组的关系等等. ·常量池的相关概念. ·包装类的特点. 2. 书面作业 1. String-使用Eclipse关联jdk源代码 1.1 ...