IAmor

# React - 02

# 删除数据

没啥好说的，唯一注意的就是不能直接操作state，说是会在渲染时增加复杂度。

let list = this.state.list
list.splice(0,1)
this.setData({
    lsit: list
})

??? 我就有点好奇，直接赋值对象那不还操作的state吗，可能人家有什么操作吧

# css引入

也没啥好说的，直接impot完事。

暂时遇到两个特殊的属性

  • className
  • forName

# 关闭转义

这个操作开发过程中基本上用不到，既然存在，那万一呢

<li danggerouslySetInnerHTML={{__html: item}}></li>

# React snippets

一个Live Template，很强大的工具等全部学完react 单独拿出来进行学习

暂时就记住一个

  • rcc - 生成基础的Component

# 组件的拆分

和Vue一样，export, import,引入后将标签写在想要的位置。组件标签首字母大写

// SisterItem
import React, {Component} from 'react';
class SisterItem extends Component {
  render() {
    return (
      <div>
        <li>1</li>
        <li>2</li>
      </div>
    );
  }
}

export default SisterItem;

// Sister

import SisterItem from "./SisterItem";
<SisterItem></SisterItem>

思考: 01中学习的将Component按照id插入的方式应该只存在于类似后台管理系统布局的方式，其他小的部分都以这种形式进行引入。

# React为何不允许直接修改state

  1. 直接修改state，react不会重新render
  2. setState更新是异步的，react将修改的状态放入更新队列，并考虑的需要render的次数，会将多个值一次性改变。

← React - 03 →