react实战笔记50:获取表单数据2

简介: react实战笔记50:获取表单数据2
// 创建三个变量,用来存储表单中的数据
    let inputDate = '';
    let inputDesc = '';
    let inputTime = 0;
    // 创建一个响应函数,监听日期的变化
    const dateChangeHandler = (e) => {
        // 获取到当前触发事件的对象
        // 事件对象中保存了当前事件触发时的所有信息
        // event.target 执行的是触发事件的对象(DOM对象)
        //console.log(e.target.value);
        inputDate = e.target.value;
    };
    // 监听内容的变化
    const descChangeHandler = (e) => {
        // 获取到当前触发事件的对象
        // 事件对象中保存了当前事件触发时的所有信息
        // event.target 执行的是触发事件的对象(DOM对象)
        //console.log(e.target.value);
        inputDesc = e.target.value;
    };
    //监听时长的变化
    const timeChangeHandler = (e) => {
        // 获取到当前触发事件的对象
        // 事件对象中保存了当前事件触发时的所有信息
        // event.target 执行的是触发事件的对象(DOM对象)
        //console.log(e.target.value);
        inputTime = e.target.value;
    };

进行表单数据的一个赋值

相关文章
|
1天前
|
存储 前端开发 JavaScript
React Hooks实战:从useState到useContext深度解析
React Hooks 深度解析:useState用于函数组件的状态管理,通过初始化和更新状态实现渲染控制;useContext则提供跨组件数据传递。useState的状态更新是异步的,不支持浅比较,可结合useEffect处理副作用。useContext在多层组件间共享状态,但可能导致不必要的渲染。两者结合可创建复杂应用场景,如带主题切换的计数器。了解其工作原理和优化策略,能有效提升React应用性能。
|
15天前
|
存储 SQL 前端开发
React&Nest.js社区平台(四)——✏️文章发布与管理实战
React&Nest.js社区平台(四)——✏️文章发布与管理实战
|
18天前
|
前端开发 JavaScript 开发者
vue3、react组件数据传值对比分析——父组件传递子组件,子组件传递父组件(二)
vue3、react组件数据传值对比分析——父组件传递子组件,子组件传递父组件
22 0
|
19天前
|
存储 前端开发 JavaScript
React的表单处理:受控组件与非受控组件深入解析
【4月更文挑战第25天】React表单处理涉及受控和非受控组件。受控组件通过状态管理表单数据,每次用户输入都触发状态更新,确保数据同步,适合实时交互但可能影响性能。非受控组件不直接管理状态,数据存储在DOM中,简化代码,适用于更新不频繁的场景,但在数据验证和同步上存在挑战。开发者应根据需求灵活选择。
|
4月前
|
数据可视化 前端开发 JavaScript
react+datav+echarts实现可视化数据大屏
最近有点闲,就学习了下react,没想到就把react学完了,觉得还不错,就打算出一把react+datav的简易版可视化数据大屏供大家做个参考
177 2
react+datav+echarts实现可视化数据大屏
|
4月前
|
前端开发 JavaScript API
【第46期】一文了解React表单
【第46期】一文了解React表单
12 0
|
5月前
|
JavaScript 前端开发
【HTML+REACT+ANTD 表格操作】处理(改变)数据,改变DOM
【HTML+REACT+ANTD 表格操作】处理(改变)数据,改变DOM
|
5月前
|
前端开发 开发者
React 组件的 children 数据使用
React 组件的 children 数据使用
41 0
|
5月前
|
前端开发
React 表单与事件
React 表单与事件
|
4月前
|
设计模式 前端开发 数据可视化
【第4期】一文了解React UI 组件库
【第4期】一文了解React UI 组件库
126 0