学习react中,我一直认为,总组件里面才有构造函数,但是我才发现我的观点是错误的,构造函数是可以出现在子组件里面的。

今天有一个错误是点击增加/减少input框里面 的数值

我一直在寻找input框里面的数值,也就是value值,我发现我的思维错误的很彻底。react只是view,是不能操作数据的,只能渲染原始数据的变化,换句话说就是我要改变数值,只能改变原始数据里面的值,然后重新渲染到input框里面。

我的原始数据,给了

value:1;

当点击时候,构造函数

add(e){

  var num = this.state.value;   //首先得到原始的value值

  num ++;   //我每次点击都是给原始的值,增加1

  this.setState({    //重新渲染数据

    value:num

  })

}

等于说,我根本就没有获得过input框里面的值,input框里面的值,都是渲染出来,我更改的也是原始值。

所以,我以后的思维要转变一下,我是根本得不到dom组件里面的任何东西的,页面的结果都是从原始数据里面渲染出来的。所以,当我要想修改这些数据的时候,不要再想着怎么更改这些标签里面的值,而要从原始数据里面更改

react.js学习之路六的更多相关文章

  1. react.js学习之路二

    看react.js对我来说真的不是难不难的问题,问题是我的思路太难转变了,真是坑死我了,react里面的坑也很多.算了,这些抱怨没啥用,记录一下今天学习的内容. 今天看了to-do-list经典示例 ...

  2. react.js学习之路四

    针对学习react.js中,我感觉最大的疑惑点就是bind(this)的绑定和指向问题了,我被这个问题弄的头昏,有时候调用组件的时候,直接显示undefined,不存在这个组件,当时的心情是崩溃的,整 ...

  3. react.js学习之路三

    学习react.js,知识点整理: 1.props和state: props是相对于父级来说,固定的不会改变的内容.一般会先定义一个变量,则在父级中进行引用, var user = "liu ...

  4. react.js学习之路一

    今天新老大来了,我们要学习他使用的框架react.js,现在是两眼一抹黑,对于我这个前端菜鸟来说,是真正的重新开始,好了,不说那么多了,开始随便记录我的学习,之后再整理内容. (1)对于react来说 ...

  5. react.js学习之路五

    最近没时间写博客,但是我一直在学习react,我发现react是一个巨大的坑,而且永远填不完的坑 关于字符串的拼接: 在react中,字符串的拼接不允许出现双引号“” ,只能使用单引号' ',例如这样 ...

  6. 【温故知新】——BABYLON.js学习之路·前辈经验(二)

    前言:在上一篇随笔BABYLON.js学习之路·前辈经验(一)中回顾了组内同事们长时间在Babylon开发实践中的总结出的学习之路和经验,这一篇主要对开发中常见的一些功能点做一个梳理,这里只作为温故知 ...

  7. React.js学习

    React.js学习之环境搭建 1 工欲善其事必先利其器:前端开发工具 1.1 WebStorm和Sublime Text Sublime Text:作为代码编辑器,Sublime Text的优点如下 ...

  8. React.js学习知识小结(一)

    学习React也有半个月了吧,这里对所学的基础知识做个简单的总结.自己先是跟着官方文档学,差不多学了四五天,也跟着入门教程做了一个简单的小栗子.然后跟着阮一峰老师的教程上手了几个小Demo,后来在网上 ...

  9. React.js学习小结

    最近一段时间都在学习React.js,感觉还不错,现在把自己的一些学习笔记记录一下,留着以后学习查看. 0.React全家桶(技术栈) 1.React主体 2.WebPack:grunt.gulp自动 ...

随机推荐

  1. keepalived之vrrp_script详解

    通常情况下,利用keepalived做热备,其中一台设置为master,一台设置为backup.当master出现异常后,backup自动切换为master.当backup成为master后,mast ...

  2. python中函数作用域

    在python中,一个函数就是一个作用域 name = 'xiaoyafei' def change_name(): name = 'sthu' print('在change_name里的name:' ...

  3. windows版本免安装redis, nginx, zookeeper

    redis官网:https://redis.io/ windows版本免安装redis下载链接:https://github.com/MSOpenTech/redis/releases nginx官网 ...

  4. 待解决:2bootstrap-cerulean.css Failed to load resource: the server responded with a status of 404 ()

    2bootstrap-cerulean.css Failed to load resource: the server responded with a status of 404 ()

  5. Mask_RCNN训练自己的模型(练习)

  6. adf错误

    1>无法验证事务处理中的所有行 运行项目报错: javax.faces.el.EvaluationException: oracle.jbo.TxnValException: JBO-27023 ...

  7. easyui-tabs扩展根据自定义属性打开页签

    .增加扩展 <script type="text/javascript" > /** * @author {kexb} easyui-tab扩展根据id切换页面 */ ...

  8. 在git bash中使用命令行调用tortoisegit提交代码或查看日志

    Tortoisegit commit / show log命令行 TortoiseGitProc.exe /command:commit TortoiseGitProc.exe /command:lo ...

  9. DeepLearning 学习资料

    1 sotfmax 函数: stanford UFLDL: http://deeplearning.stanford.edu/wiki/index.php/Softmax%E5%9B%9E%E5%BD ...

  10. Inno Setup创建快捷方式跟快速运行栏快捷方式

    [Tasks] Name: "desktopicon"; Description: "{cm:CreateDesktopIcon}"; GroupDescrip ...