Не работает ввод в Mobx Store на Reactjs - PullRequest
Новая
       11

Не работает ввод в Mobx Store на Reactjs

0 голосов
/ 19 марта 2019

Сначала я сделал «Store», как показано ниже.
Я хочу перевести вход в состояние входа в режиме реального времени. 

import { observable, action } from 'mobx'

export default class SingUpIn {
  @observable initialState = {
    register: {
      email: '',
      username: '',
      password: '',
      passwordConfirm: ''
    },
    login: {
      email: '',
      password: ''
    }
  }

  @action changeLogin = (name, value) => {
    this.initialState.login.name = value
  }
}

И я ввел это в один компонент.
Но когда я что-то пишу на входе, любой ввод не отображается
Не могли бы вы порекомендовать какое-нибудь решение? 

import React, { Component } from 'react'
import { Link } from 'react-router-dom'
import { observer, inject } from 'mobx-react'

@inject('SignUpIn')
@observer
class SignUp extends Component {
  handleChange = e => {
    const { SignUpIn } = this.props
    SignUpIn.changeLogin(e.target.name, e.target.value)
  }

  render () {
    const { SignUpIn } = this.props

    return (
      <div>
        <input
          id="email"
          name="email"
          placeholder="email"
          value={SignUpIn.initialState.login.email}
          onChange={this.handleChange}
        />
      </div>
    )
  }
}

export default SignUp

Ответы [ 2 ]

2 голосов
/ 19 марта 2019

попробуйте использовать это 

@action changeLogin = (name, value) => {
    this.initialState.login[name]= value
  }
1 голос
/ 19 марта 2019

Просто чтобы напомнить причину о kkangil решении: -

Когда вы используете (.) Нотацию для доступа к свойству объекта, он будет искать строковое значение имени свойства.

this.initialState.login.name: Это будет просто искать строковое значение name в объекте.

Где при использовании скобочной нотации [] идентификаторы свойства должны быть строкой или переменной, которая ссылка строка.

Итак, вы можете использовать имя, которое является переменной, ссылающейся на другую строку.

например 

var obj = {
    charmandar: 'fire',
    squirtle: 'water'
}

var charmandar = 'squirtle'

console.log (obj.charmandar); // огонь

* * 1 022 console.log (OBJ [charmandar]); // вода
...