简体   繁体   中英

How to get the value of all keys in an array with AppContext (React.js)

I have a project where I need to get data from js file and use it in Checkbox.Group (antd).

I've been in React for a couple of days and javascript also just didn't know, help

import React, { useState, useContext } from 'react'
import { Menu, Button,Dropdown, Checkbox } from 'antd'
import {AppContext} from '../../../context/main'

const Name = () => {
    const [visible, setVisible] = useState(false)
    const {preschool} = useContext(AppContext)
    const menu = (
        <Menu className="dropdown-menu">
            <Checkbox.Group
                // onChange={(v) => setLabels(v)}
                options={preschool.Наименование}
                className="checkboxGroup"
            />
            <Button size="large">Сбросить</Button>
            <Button size="large">Сохранить</Button>
        </Menu>
    )
    return (
        <Dropdown 
            overlay={menu}
            visible={visible}
            onVisibleChange={(val) => setVisible(val)}
        >
            <Button 
                className="button" 
                ghost={true}
            >
                Наименование
            </Button>
        </Dropdown>
    )
}
export default Name

it is main.js file

const preschool_data = [
  {
    Наименование: 'ГККП "ясли сад №1',
    Язык_Обучения: 'Русский',
    Форма_учереждения: 'Государственная',
    'Проектная мощность': '190',
    'Фактическая наполненность': '240',
    '%': '126%',
    Наполненность: '',
    KPI: 'red',
    Рейтинг: '9.73',
  }

Try using [Object.values()][1]

returns an array of a given object's own enumerable property values

 const preschool_data = { Наименование: 'ГККП "ясли сад №1', Язык_Обучения: 'Русский', Форма_учереждения: 'Государственная', 'Проектная мощность': '190', 'Фактическая наполненность': '240', '%': '126%', Наполненность: '', KPI: 'red', Рейтинг: '9.73', }; console.log(Object.values(preschool_data));

What's the error you're getting?

Just in case, check these:

1) Make sure AppContext refers to the context and not the provider:

const AppContext = createContext()

2) In your provider, make sure it's value and not valueS :

<AppContext.Provider value={{ preschool }}>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM