TodoList实现增删改查功能
-
功能代码需要实现:
(1) 添加数据
(2). 查询数据,展示
(3). 删除数据
(4). 修改数据 -
数据持久化操作
localStorage.setItem(‘key’,value)
var value = localStorage.getItem(‘key’) -
修改state属性
this.setState(参数1,参数2), 修改state属性的函数
参数1是要更新的数据对象,参数2是回调函数,参数2的主要作用是,用于展示更新后的state数据
另:setState()方法是异步方法
如果在setState()函数外保存数据,有可能保存不了,因为保存时数据还没更新
1、HTML页面代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="Web site created using create-react-app" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>React App</title>
<style>
*{
margin:0;padding:0;}