dangerouslySetInnerHTMl
dangerouslySetInnerHTMl 是React标签的一个属性,类似于angular的ng-bind;
听说这个单词这么长,是故意的,应为有可能不合时宜的使用innerHTML会导致XSS攻击(然而我并不懂什么是XSS),
__htlml: DOM;
通常dangerSetInnerHTML(这个糟糕的单词,,这么长。。)是和__html配套使用的,用来在一个标签中插入许多个标签(安全的插入);
通常写法:
var HelloMessge = React.createClass({
render: <div
dangerouslySetInnerHTML={{
__html: '<h3>hahhah</h3>'
}}>
</div>
})
当然既然可以插入DOM,也可以插入字符串。。
dangerouslySetInnerHTML={{
__html: 'hahahhahaha'
}}>
之所以是有2个{{}},是因为第一{}代表jsx语法开始,第二个是代表dangerouslySetInnerHTML接收的是一个对象键值对
参考文献:
http://wiki.jikexueyuan.com/project/react/dangerously.html
http://www.cnblogs.com/shamgod/p/5052312.html
dangerouslySetInnerHTMl的更多相关文章
- 【原】dangerouslySetInnerHTML, 让React正常显示你的html代码
昨天在弄一个让内容换行显示时,遇到一个问题,就是我有<br />的代码在页面中不换行,而是直接显示<br />,代码如下: <!DOCTYPE html> < ...
- React-非dom属性-dangerouslySetInnerHTML标签
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...
- React dangerouslySetInnerHTML - 将HTML字符串解析为html样式显示
<div dangerouslySetInnerHTML={{ __html: curriculumDesc }}></div>
- React用dangerouslySetInnerHTML动态渲染HTML
React用dangerouslySetInnerHTML动态渲染HTML React项目,需要把后台返回的一段html代码在页面上显示 在render获取内容, //在render里获取内容 con ...
- react中dangerouslySetInnerHTML使用
在react中,通过富文本编辑器进行操作后的内容,会保留原有的标签样式,并不能正确展示. 在显示时,将内容写入__html对象中即可.具体如下: <div dangerouslySetInner ...
- React.js深入学习详细解析
今天,继续深入学习react.js. 目录: 一.JSX介绍 二.React组件生命周期详解 三.属性.状态的含义和用法 四.React中事件的用法 五.组件的协同使用 六.React中的双向绑定 ...
- React项目(一):markdown编辑器
在之前的React官网教程中,提到了用Remarkable为插件的markdown评论框.现在就来正儿八经地用另外一个插件marked.js做一个markdown编辑器吧! 准备工作 或许在做之前,应 ...
- React.js入门笔记(再续):评论框的实现
本案例来自React.js中文官网对应内容. 一. 运行环境 <link rel="stylesheet" type="text/css" href=&q ...
- react学习与简介
简介: React是Facebook开发的一款JS库 React解决了什么问题? 1).首先是以往mvc模式的缺陷,当代码库庞大时,mvc非常的复杂,每添加新的功能,项目的复杂度就几何倍的增长,导致代 ...
随机推荐
- 22.executor service Flask
pip包管理器 没有npm那么强大 不支持 npm --save install 这样的方法 但是我们有别的方法 安装Flask 但是呢 我们不能把它存放在package .json 那就需要我们自己 ...
- Hibernate 再接触 基础配置 搭建Log4j环境 Junit日志环境等
<!-- Drop and re-create the database schema on startup --> <property name="hbm2ddl.aut ...
- C++学习一explicit
explicit关键字 C++中的关键字explicit主要是用来修饰类的构造函数,被修饰的构造函数的类,不能发生相应的隐式类型转换,只能以显示的方式进行类型转换.类构造函数默认情况下声明为隐式的即i ...
- git 先建立本地分支,再传给线上库
cd 进入本地一个文件夹 git clone 文件下来 进入右下角 develop分支(remote braches) 新建分支 (check out) a 把新分支 a 传上线上 新建一个对立 ...
- linux 内核根文件系统
参考: http://blog.csdn.net/guopeixin/article/details/5962482 http://www.yunweipai.com/archives/1184.ht ...
- 2017秋季面向对象程序设计(Java)教材、教学纲要、考核要求
教材简况 凯 S.霍斯特曼 (Cay S. Horstmann)(作者), 周立新(译者), Java核心技术(卷1):基础知识(原书第10版) , 2016年9月1出版 本书包括两卷,选做教材的是卷 ...
- grabcut 分割 Rect
#include "opencv2/opencv.hpp" using namespace cv; void main() { Mat src = imread("E:\ ...
- 04_web基础(四)之servlet详解
16.17.18.servlet生命周期 javax.servlet.Servlet接口方法:public String getServletInfo():获取Servlet相关信息(作者,版权,版本 ...
- ORA-30926: 无法在源表中获得一组稳定的行ORA-06512: 在 "STG.FP_MO_SPLIT", line 1562 临时
- metasploit framework(五):meterpreter基本命令和python扩展
基于内存的DLL注入式payload 注入合法的系统进程并建立stager 基于stager上传和预加载DLL进行扩展模块的注入(客户端API) 基于stager建立的socket连接建立加密的TLS ...