データアップロードの無効化

10592 ワード
React 個人プロジェクト テキストリンク
mdnではdisabledをこのように説明している.Booleanが無効なプロパティがある場合は、要素を変更、フォーカス、またはフォームとともにコミットすることはできません.
私が構成したコード構造では、データの名前が必要です.
case ADD_TODO:
          console.log(action.addtodo)
          console.log(action.addtodo.data)          
          // name이 같은 데이터를 찾는다 
          let data = state.items.find((ele:any) => (ele.name === action.addtodo.data))
          console.log(data); 
          // addData라는 변수에 action.payload 넣고
          const addData = Object.assign({}, data, { textBox: [...data.textBox, action.addtodo.data]})
          console.log(addData);
          // 데이터를 전체 state 값들과 합친다.         
              for (let i = 0; i<state.items.length; i++ ) {
                if(state.items[i].name === addData.name) {
                state.items[i] = addData
              }
            }      
          return Object.assign({}, state)
reduceからactionでデータを受信する場合、各写真の文字を記録するためにid値に各配列を検索させるのではなく、コードをnameを検索するように構成するので、name値が必要です.したがって,name値を入力しないと登録できず,追加の価格を入力しないと登録できない.障害者を解決策とする.前に記録した検証コードから見ると、
const onNameChange = (e:React.ChangeEvent<HTMLTextAreaElement>) => {
    setName(e.target.value)
    if (e.target.value.length < 2 || e.target.value.length > 20) {
      setNameMessage('2글자 이상 20글자 이하로 입력해주세요.')
      setIsName(false)
    } else {
      setNameMessage('올바른 이름 형식입니다 :)')
     * setIsName(true)
    }

  }
  const onPriceChange = (e:React.ChangeEvent<HTMLTextAreaElement>) => {
    const priceVali =  /^[0-9]+$/
    const priceCurrent = e.target.value;
    setPrice(priceCurrent)
    if (!priceVali.test(priceCurrent)) {
      setPriceMessage('숫자만 입력해주세요')
    } else {
      setPriceMessage('올바른 형식입니다.')
     * setIsPrice(true);
    }
  }
登録は、setisName(true)setisPrice(true)が正しい形式に設定されている場合にのみ構成されるためです.
<button type='submit' className='submitBtn' disabled={!(isName && isPrice)}>등록</button>
実際、これは簡単なコードかもしれませんが、これは私が初めて試した機能で、最初は悩んでいましたが、幸いにも実現しました.
[スパルタコードクラブ]ネットワーク開発総合クラス第1週
WebBrowserコントロールを拡張し、ファイルのドラッグアンドドロップをサポート