@@ -14,7 +14,7 @@ redirect_from:
14
14
- " tips/dangerously-set-inner-html.html"
15
15
---
16
16
17
- React 实现了一套独立于浏览器的 DOM 系统,兼顾了性能和跨浏览器的兼容性。我们借此机会完善了浏览器 DOM 实现的一些边缘情况 。
17
+ React 实现了一套独立于浏览器的 DOM 系统,兼顾了性能和跨浏览器的兼容性。我们借此机会完善了浏览器 DOM 实现的一些特殊情况 。
18
18
19
19
在 React 中,所有的 DOM 特性和属性(包括事件处理)都应该是小驼峰命名的方式。例如,与 HTML 中的 ` tabindex ` 属性对应的 React 的属性是 ` tabIndex ` 。例外的情况是 ` aria-* ` 以及 ` data-* ` 属性,一律使用小写字母命名。比如, 你依然可以用 ` aria-label ` 作为 ` aria-label ` 。
20
20
@@ -24,7 +24,7 @@ React 与 HTML 之间有很多属性存在差异:
24
24
25
25
### checked {#checked}
26
26
27
- 当 ` <input> ` 组件的 type 类型为 ` checkbox ` 或 ` radio ` 时,组件支持 ` checked ` 属性。你可以使用它来设置组件是否被选中。这对于构建受控组件很有帮助 。而 ` defaultChecked ` 则是非受控组件的属性,用于设置组件首次挂载时是否被选中。
27
+ 当 ` <input> ` 组件的 type 类型为 ` checkbox ` 或 ` radio ` 时,组件支持 ` checked ` 属性。你可以使用它来设置组件是否被选中。这对于构建受控组件(controlled components)很有帮助 。而 ` defaultChecked ` 则是非受控组件的属性,用于设置组件首次挂载时是否被选中。
28
28
29
29
### className {#classname}
30
30
@@ -34,7 +34,7 @@ React 与 HTML 之间有很多属性存在差异:
34
34
35
35
### dangerouslySetInnerHTML {#dangerouslysetinnerhtml}
36
36
37
- ` dangerouslySetInnerHTML ` 是 React 为浏览器 DOM 提供 ` innerHTML ` 的替换方案。通常来讲,使用代码直接设置 HTML 存在风险,因为用户很可能会受到 [ 跨站脚本(XSS)] ( https://en.wikipedia.org/wiki/Cross-site_scripting ) 攻击 。因此,你可以直接在 React 中设置 HTML,但当你想设置 ` dangerouslySetInnerHTML ` 时,需要向其传递包含 key 为 ` __html ` 的对象,以此来警示你。例如:
37
+ ` dangerouslySetInnerHTML ` 是 React 为浏览器 DOM 提供 ` innerHTML ` 的替换方案。通常来讲,使用代码直接设置 HTML 存在风险,因为很容易无意中使用户暴露于 [ 跨站脚本(XSS)] ( https://en.wikipedia.org/wiki/Cross-site_scripting ) 的攻击 。因此,你可以直接在 React 中设置 HTML,但当你想设置 ` dangerouslySetInnerHTML ` 时,需要向其传递包含 key 为 ` __html ` 的对象,以此来警示你。例如:
38
38
39
39
``` js
40
40
function createMarkup () {
@@ -116,7 +116,7 @@ React 会自动添加 ”px” 后缀到内联样式为数字的属性后。如
116
116
117
117
如果你使用 React 服务端渲染,通常会在当服务端与客户端渲染不同的内容时发出警告。但是,在一些极少数的情况下,很难甚至于不可能保证内容的一致性。例如,在服务端和客户端上,时间戳通常是不同的。
118
118
119
- 如果设置 ` suppressHydrationWarning ` 为 ` true ` 时 ,React 将不会警告你属性与元素内容不一致。它只会对元素一级深度有效,并且打算作为应急方案。因此不要过度使用它。你可以在 [ ` ReactDOM.hydrate() ` 文档] ( /docs/react-dom.html#hydrate ) 中了解更多关于 hydration 的信息。
119
+ 如果设置 ` suppressHydrationWarning ` 为 ` true ` ,React 将不会警告你属性与元素内容不一致。它只会对元素一级深度有效,并且打算作为应急方案。因此不要过度使用它。你可以在 [ ` ReactDOM.hydrate() ` 文档] ( /docs/react-dom.html#hydrate ) 中了解更多关于 hydration 的信息。
120
120
121
121
### value {#value}
122
122
0 commit comments