Ant-design: Form ๊ตฌ์„ฑ ์š”์†Œ๋กœ ์–‘์‹ ์ œ์ถœ ์ฒ˜๋ฆฌ

์— ๋งŒ๋“  2017๋…„ 01์›” 12์ผ  ยท  3์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: ant-design/ant-design

here ์— ์žˆ๋Š” antd <Form/> ๊ตฌ์„ฑ ์š”์†Œ๋กœ ์–‘์‹ ์œ ํšจ์„ฑ ๊ฒ€์‚ฌ๋ฅผ ์ˆ˜ํ–‰ํ•˜๋Š” ๋ฐฉ๋ฒ•์ด ํ™•์‹คํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋ฌธ์„œ๋Š” ์ด๋ฒคํŠธ๊ฐ€ ์ „๋‹ฌ๋˜๋Š” <Form/> ๊ตฌ์„ฑ ์š”์†Œ์— onSubmit ์†Œํ’ˆ์„ ์ง€์ •ํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฐ ๋‹ค์Œ this.props.form ๋‚ด๋ถ€์˜ ๊ธฐ๋Šฅ์„ ํŠธ๋ฆฌ๊ฑฐํ•˜๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. ํ˜„์žฌ ๋‹ค์Œ ์ฝ”๋“œ๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

handleSubmit(e) {
   e.preventDefault();

  console.log('before' + e.target.value)

  this.props.validateFields((err, values) => {
  console.log('errors: ' + err)
  console.log(values)
    if (!err) {
      console.log('Received values of form: ', values);
    }
  });
}

<Form inline onSubmit={this.handleSubmit.bind(this)}>
    ....
</Form>
  1. e.target.value ๊ฐ€ undefined๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋ฏ€๋กœ ์ œ์ถœ ์ฝœ๋ฐฑ์œผ๋กœ ์ „๋‹ฌ๋œ ์ด๋ฒคํŠธ์—์„œ ๊ฐ’์„ ๊ฒ€์ƒ‰ํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

    1. ๋ฌธ์„œ์— ํ‘œ์‹œ๋œ ๋Œ€๋กœ this.props.validateFields() ์— ๋Œ€ํ•œ ํ˜ธ์ถœ์—์„œ ์ด๋Ÿฌํ•œ ๊ฐ’์€ ์–ด๋””์—์„œ ์™”์Šต๋‹ˆ๊นŒ?

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

@benjycui ์Šคํƒ ์˜ค๋ฒ„ํ”Œ๋กœ์—๋Š” ์œ ์šฉํ•œ ๋‹ต๋ณ€์ด ์—†์Šต๋‹ˆ๋‹ค. ๊ทธ๋ฆฌ๊ณ  ๊ฐœ๋ฏธ ๋””์ž์ธ MF์˜ ๋ชจ๋“  ์งˆ๋ฌธ์— ๊ฐ™์€ ๋Œ€๋‹ต์„ ๋‹ฅ์ณ. ๊ฐœ๋ฏธ ๋””์ž์ธ ํ—›์†Œ๋ฆฌ์˜ ๋ชจ๋“  ์ž์‹ ๋ฌธ์ œ๋ฅผ ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋ชจ๋“  3 ๋Œ“๊ธ€

Ant Design ํŒ€์€ GitHub ๋ฌธ์ œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๋ฒ„๊ทธ๋ฅผ ์ถ”์ ํ•˜๊ฑฐ๋‚˜ Ant Design์˜ ๊ณ„ํš์„ ๋…ผ์˜ํ•ฉ๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ์—ฌ๊ธฐ์—์„œ ์‚ฌ์šฉ ์งˆ๋ฌธ์„ ํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. Stack Overflow ๋˜๋Š” Segment Fault ์—์„œ ์งˆ๋ฌธ์„ ์‹œ๋„ํ•œ ๋‹ค์Œ antd ๋ฐ react ํƒœ๊ทธ๋ฅผ ์งˆ๋ฌธ์— ์ ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์งˆ๋ฌธํ•˜๊ธฐ ์ „์— ๋ฌธ์„œ ๋ฐ FAQ ๋ฅผ ์ฝ๊ณ  ๋ฌธ์ œ ๋ฅผ ๊ฒ€์ƒ‰ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. THX!

๋˜‘๋˜‘ํ•œ ์งˆ๋ฌธ (ๆ้—ฎ็š„ๆ™บๆ…ง)์„ ์ฝ์œผ๋ฉด ๋” ์ข‹์„ ๊ฒƒ์ด๋‹ค.

@Orbyt ๋ฌธ์ œ๊ฐ€ ํ•ด๊ฒฐ๋˜์—ˆ์Šต๋‹ˆ๊นŒ? ๋˜๋Š” ์ด ๋ฌธ์ œ์— ๋Œ€ํ•œ stackoverflow ์งˆ๋ฌธ์ด ์žˆ์Šต๋‹ˆ๊นŒ?

@benjycui ์Šคํƒ ์˜ค๋ฒ„ํ”Œ๋กœ์—๋Š” ์œ ์šฉํ•œ ๋‹ต๋ณ€์ด ์—†์Šต๋‹ˆ๋‹ค. ๊ทธ๋ฆฌ๊ณ  ๊ฐœ๋ฏธ ๋””์ž์ธ MF์˜ ๋ชจ๋“  ์งˆ๋ฌธ์— ๊ฐ™์€ ๋Œ€๋‹ต์„ ๋‹ฅ์ณ. ๊ฐœ๋ฏธ ๋””์ž์ธ ํ—›์†Œ๋ฆฌ์˜ ๋ชจ๋“  ์ž์‹ ๋ฌธ์ œ๋ฅผ ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰