如果我在React中重複自己，我應該創建一個組件嗎？

我建立具有LoginForm的和重置表單形式簡單的SPA應用。如果我在React中重複自己，我應該創建一個組件嗎？

這兩個組件的共享方法 getInputFields()和handleSubmit()

這裏是我的代碼示例：

import React from 'react'; 

import InputField from './InputField'; 
import SubmitButton from './SubmitButton'; 

class ResetForm extends React.Component { 
    constructor(props) { 
    super(props); 
    this.handleSubmit = this.handleSubmit.bind(this); 
    this.getInputFields = this.getInputFields.bind(this); 
    } 
    handleSubmit(e) { 
    e.preventDefault(); 
    console.log('submitted'); 
    } 
    getInputFields() { 
    return [ 
     { type: 'email', placeholder: 'Email' } 
    ] 
    } 
    render() { 
    return (
    <form onSubmit={ this.handleSubmit }> 
     { 
      this.getInputFields() 
      .map((field) => <InputField type={ field.type } placeholder={ field.placeholder } />) 
     } 
     <SubmitButton /> 
     </form> 
    ) 
    } 
} 

export default ResetForm;

而且我LoginForm的只有不同的數據（內getInputFields()）

如果我再說一遍，我是否應該自動考慮製作一個新組件？例如在這種情況下是<Form>組件並將getInputFields()的值作爲通道傳遞給Form？

來源

2017-02-15 Dan

可能會有幫助https://twitter.com/dan_abramov/status/793127800769224704?lang=en – Abhishek

在一般情況下，無論是建設有反應或用Java編寫一個程序或任何軟件的東西，如果你重複的代碼通常是個好主意，就看你如何整理所有到一個源的Web應用程序。它可能無法提高軟件的效率，但組織更簡單，組織更簡單，而且容易出錯，因爲只有一個地方可能會出現錯誤。

之一好話大約陣營是能夠使可重用的組件，而這樣做當然可以構建和調試應用程式更容易。然而，並非一切都已經成爲一個組成部分，如果你把一個簡單的組不重用元素，並把它變成像3個不同的反應的組分只是因爲你可以，這有點像過早優化。你應該停下來思考'我是否會重複使用這組HTML，如果它是以組件的形式，我會得到什麼好處？'

對於React，特別看你的例子，如果你從中獲取數據的輸入字段在類型和數字上是不同的，並且你在提交時執行的動作在兩種表單類型之間是不同的我假設他們是），那麼可以有兩個不同的組件（就像你一樣）。你可以有一個額外的組件就像你說的，一個<Form />組件，它利用getInputFields()值，如果你想，但它看起來像你的形式HTML是很小的。只是表單元素，有一些動態組件和一個提交按鈕。因此，因爲它不是一個很大的HTML和這裏只有2它的情況下，你可以把它放在組件形式，但它不是東西是在它的迫切需要，我敢肯定有更大的事情擔心。還有平時我發現兩種情況下我做組件：

HTML和相關功能的一束用很多很多的時間
HTML和相關功能的一束用了幾次，但它是一個很多HTML或許多功能，以便在需要它們的每個組件中重複它們會使代碼變得龐大並使其難以通讀或調試

我通常所做的只是創建組件，並在看到東西時被重複使用多次，然後每隔一段時間（最後），我會仔細看看是否有任何小小的ngs在這裏和那裏可能會被凝聚成單個React組件，只是爲了讓事情變得更清潔。

到底它的好，使組件以上這兩個原因，但如果涉及到微小的東西（像被重複，也許2-3次1種或兩個HTML元素），那麼我會擔心大在強調小東西之前先做好充分的準備。

來源

2017-02-15 12:29:47 Jayce444

好的答案，它絕對有意義，符合DRY的概念。我現在不會擔心，但是當我完成時我會探索它，我期待重構。 – Dan

如果我在React中重複自己，我應該創建一個組件嗎？

回答

相關問題