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. BP神经网络的手写数字识别

    BP神经网络的手写数字识别 ANN 人工神经网络算法在实践中往往给人难以琢磨的印象,有句老话叫“出来混总是要还的”,大概是由于具有很强的非线性模拟和处理能力,因此作为代价上帝让它“黑盒”化了.作为一种 ...

  2. javascript md5 二次加密 和 java md5 二次加密结果不同

    最近研究httpclient post 时遇到了一个问题,很费解. js  md5(str) 和 java md5(str),第一次md5 加密结果一样,(当时忽略了大小写问题,java 大写,js小 ...

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

    2014-04-29 00:04 题目:给定一个整数数组,找出所有加起来为指定和的数对. 解法1:可以用哈希表保存数组元素,做到O(n)时间的算法. 代码: // 17.12 Given an arr ...

  4. 《Cracking the Coding Interview》——第13章：C和C++——题目4

    2014-04-25 19:50 题目:深拷贝和浅拷贝有什么区别?如何应用? 解法:深拷贝传值,浅拷贝传引用.java里对此做了限制,而C++里面用起来更自由.大结构不宜传值,因为拷贝过程效率低. 代 ...

  5. Linux利用OneinStack搭建环境

    OneinStack官方网站:https://oneinstack.com 介绍 OneinStack支持以下数种环境组合: LNMP(Linux + Nginx+ MySQL+ PHP) LAMP( ...

  6. Oz 创建Windows2008R2镜像

    此tdl和auto文件只可定义windows disk bus以ide模式启动,不支持virtio. <template> <name>Windows-gushiren< ...

  7. CodeForces-1061D TV Shows

    题目链接 https://vjudge.net/problem/CodeForces-1061D 题面 Description There are nn TV shows you want to wa ...

  8. ubuntu16.04 搭建nexus+maven 学习

    /opt/nexus-2.10.0-02/bin vim nexus 关键配置: RUN_AS_USER=root JAVA_HOME=/usr/lib/java/jre export NEXUS_H ...

  9. CSS 3中细线边框如何实现？

    在app应用开发中,我们常常都需要用到css3来设置应用的样式.由于app都是在移动设备上进行展示,所以边框描边的线一般都小于1px,而以往我们使用的都是1px及以上的.那么问题来了,对于小于1px的 ...

  10. getprop 获取android系统属性

    Android属性系统 property_get/property_set  (很透彻)http://www.blogjava.net/MEYE/articles/359773.html getpro ...