本文说的mvvm框架以react为列,其他应该也是类似的;
react实际上仅仅是帮助我们再View层简化,让我们仅仅需要专注数据,只要数据改变,所有的视图就会自己跟随着改变,
本人自己做react项目目前大概一个多月,然而,好几次都仍然想着使用jQuery的方式,经过同事的指点,发现了此jQuery之所有被我们所弃用,并不是盲目的想要摒弃以前的东西,而是真的使用它远没用不用他效率高!,
以今天自己写的项目的一个小点来说:
handleSave(e) {
let textareaEles = document.querySelectorAll("textarea[data-id]"); let textareaDataArr = []; for (let i = 0; i < textareaEles.length; i++) { debugger; let textareaEle = textareaEles[i]; textareaEle.dataId; textareaDataArr.push({ id: textareaEle["data-id"], remark: textareaEle.innerHTML }) } let json = JSON.stringify(textareaDataArr);//这个是获取的JSON}
上面这个是仍然使用jQuery的编程模式, 1、先把获取到的数据,动态生成给元素并让它添加 data-id 属性,然后再一个一个循环获取!最后我再提交数据,十分低效
而使用react这类框架,思路其实更加简单, 1、先把获取到的数据,然后把textArea的value绑定为state.data;当textArea触发onChange的时候,直接改变state.data的值,textArea就会实时改变,而且最后要提交给后台的数据,也仍然是data。
整个过程就是通过state.data来实现数据的双向绑定!!!十分简单
时间: 2024-11-05 14:57:23