defaultValue 更改不会重新渲染输入 [英] defaultValue change does not re-render input

问题描述

我不知道为什么这不起作用

I have no idea why this is not working

演示

我有以下 es6 代码

I have the following es6 code

const {createFactory, createClass, DOM: { label, input, button }} = React;

const tester = createFactory(createClass({
  render() {
      return label({}
               ,`Name: ${this.props.name}`
               ,input({defaultValue: this.props.name})
               ,button({onClick: this.changeName}, "Change")
             )
  },
  changeName() {
    this.setProps({name: "Wilma"})
  }
}) )

React.render(tester({name: "Fred"}), document.querySelector('body'))

点击按钮显然改变了道具，但旧的defaultValue仍在输入中！那么什么给呢?我究竟做错了什么?这是一个错误吗?有解决方法吗?

Clicking the button clearly changes the props, but the old defaultValue is still in the input! So what gives? What am I doing wrong? is this a bug? Is there a workaround?

推荐答案

你只指定它的默认值，但不要告诉它通过改变 props 来改变它的值.

You only specify its default value, but don't tell it to change its value with a change to props.

,input({value: this.props.name})

当 this.props.name 改变时会改变值.

Will change the value when this.props.name changes.

http://output.jsbin.com/melitecimo

这篇关于defaultValue 更改不会重新渲染输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！