Как организовать извлеченные данные в React - PullRequest
Новая
       66

Как организовать извлеченные данные в React

0 голосов
/ 07 марта 2020

Я получил эти данные из базы данных: 

{-M1pSe35WgpDekyV1A6_:{cword':"শ্বশুর", wword: "শশুর"}},
{-M1pSoUng04mDi7rImUT:{cword: "শাশুড়ী", wword: "শ্বাশুড়ি"}},
{-M1pSyZ1FgiuKKjA8p2h:{cword: "ব্রাহ্মনবাড়িয়া",wword: "ব্রাম্মনবাড়ীয়া"}},
{-M1pTB2ktY8A3hk4mati:{cword: "স্টুডিও", wword: "ষ্টুডিও"}}

После использования Object.values ​​это выглядит так: 

 [
{cword':"শ্বশুর", wword: "শশুর"},
{cword: "শাশুড়ী", wword: "শ্বাশুড়ি"},
{cword: "ব্রাহ্মনবাড়িয়া",wword: "ব্রাম্মনবাড়ীয়া"},
{cword: "স্টুডিও", wword: "ষ্টুডিও"}
]

Сейчас Я хочу использовать массив как array [0] .cword, array [1] .cword .

Но когда я назначаю const somthing = array[0].cword, он говорит, что слово не определено. ** Это мой компонент, из которого я извлек данные: **

import React,{useState, useEffect} from 'react';
import Button from '../UI/Button/Button';
import Input from '../UI/Input/Input';
import axios from '../../axios';

import './CheckWord.css';

const CheckWord = ({}) => {
  const [state, setState] = useState({
    data: '',
    cWord:''
  });
  useEffect(()=>{
    const fetchedData = async ()=>{
      const result = await axios.get('/words.json',);
      setState({data: Object.values(result.data)});
    }
    fetchedData();
  },[]);
  // Here I want to use the state.data like **let nword = state.data[0].cword or state.data[1].cword** 
  // Submit Change Handler 
  const submitChangeHandler = (e)=>{
      e.preventDefault();
  }
  return(
    <div className='CheckWord'>
      <h4>শব্দ</h4>
      <form className='Form' onSubmit={submitChangeHandler}>
        <Input pholder='উপরের শব্দটি লিখুন' />
        <Button btnName='Submit'/>
      </form>
    </div>
  )
}

export default CheckWord;

Как можно последовательно использовать свойства cword ? например: array [0] .cword, array [1] .cword или любым другим способом .

1 Ответ

0 голосов
/ 07 марта 2020

Как state={data:[...]}, вы можете получить доступ к значениям mapping через массив 

    const state={
      data: [
        {cword:"শ্বশুর", wword: "শশুর"},
        {cword: "শাশুড়ী", wword: "শ্বাশুড়ি"},
        {cword: "ব্রাহ্মনবাড়িয়া",wword: "ব্রাম্মনবাড়ীয়া"},
        {cword: "স্টুডিও", wword: "ষ্টুডিও"}
      ]
    }

  state.data&&state.data.map(obj=>{
        console.log(obj.cword)
    })
...