首页 > Web开发 > 详细

JSX 语法

时间:2020-02-16 17:36:40      阅读:51      评论:0      收藏:0      [点我收藏+]

1.如何写注释在JSX:

{/* comments */}

{

//

}

 

2. Fragment 替代最外层的div 
import React, { Component, Fragment } from ‘react‘;
3. e.target.value
每次触发DOM事件时会产生一个事件对象(也称event对象),此处的参数e接收事件对象。而事件对象也有很多属性和方法,其中target属性是获取触发事件对象的目标,也就是绑定事件的元素,e.target表示该DOM元素,然后在获取其相应的属性值。
this就是指向当前事件所绑定的元素,而e.target指向事件执行时鼠标所点击区域的那个元素。容易搞不懂的地方是,初学者会认为当前事件所绑定的元素不就是鼠标所点击的那个元素嘛,这时候就要看看事件绑定的元素内部有没有子元素了,如果有子元素的话e.target指向这个子元素,如果没有,e.target和this都指向事件所绑定的元素。
4. splice具有删除,插入,替换的功能

1:删除的功能

splice(index,count)

参数:

index:开始位置的索引

count:要删除元素的个数

返回:返回的是包含被删除元素的数组对象

3:替换功能

splice(index,num,value)

index:开始的索引位置

num:删除项的数(如果num为0,就是插入功能)

value:插入的值

5. 扩大input 的点击范围

<label htmlFor=‘insertArea‘>input content</label>
<input
id=‘insertArea‘
6. 能够解析html 标签的输入
dangerouslySetInnerHTML={{__html: item}} 
7. bind()方法主要就是将函数绑定到某个对象,bind()会创建一个函数,函数体内的this对象的值会被绑定到传入bind()第一个参数的值,例如,f.bind(obj),实际上可以理解为obj.f(),这时,f函数体内的this自然指向的是obj
8. 父组件如果向子组件传递属性和方法?是通过属性
<TodoItem
content={item}
index={index}
deleteItem={this.handleItemDelete.bind(this)}
/>
子组件如果使用父组件的传来的属性和方法, 是通过props
{this.props.content}
handleClick() {
this.props.deleteItem(this.props.index)
}
 
 

JSX 语法

原文:https://www.cnblogs.com/padingdun/p/12317429.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!