TypeError: render is not a function with context api
TypeError: render is not a function with context api
我试图用 React 制作一个天气应用程序。但是,我遇到了无法解决的错误。
这些是我的代码:
App.js:
import './App.css';
import SelectCity from './components/SelectCity';
import CityProvider from './context/CityContext';
function App() {
return (
<CityProvider>
<SelectCity></SelectCity>
</CityProvider>
)
}
export default App;
SelectCity.js:
import {useContext} from 'react'
import useTurkeyCities from "use-turkey-cities"
import CityContext from '../context/CityContext'
function SelectCity() {
const { cities, city } = useTurkeyCities()
const { contextCity, setContextCity } = useContext(CityContext)
return (
<div>
<select
onChange={e => {
setContextCity(e.target.value);
}}
value={city}
>
{cities.map(city => (
<option key={`city-${city}`} value={city}>
{city}
</option>
))}
</select>
</div>
)
}
export default SelectCity
CityContext.js:
import { createContext, useState } from "react";
const CityContext = createContext()
export const CityProvider = ({children}) => {
const [contextCity, setContextCity] = useState(null)
const cityValues = {
contextCity,
setContextCity
}
return <CityContext.Provider value={cityValues}>{children}</CityContext.Provider>
}
export default CityContext
但我有 TypeError: render is not a function。怎么解决这个问题,我不明白
我解决了这个错误。
import CityProvider from './context/CityContext';
我将此代码更改为:
import {CityProvider} from './context/CityContext';
我试图用 React 制作一个天气应用程序。但是,我遇到了无法解决的错误。
这些是我的代码:
App.js:
import './App.css';
import SelectCity from './components/SelectCity';
import CityProvider from './context/CityContext';
function App() {
return (
<CityProvider>
<SelectCity></SelectCity>
</CityProvider>
)
}
export default App;
SelectCity.js:
import {useContext} from 'react'
import useTurkeyCities from "use-turkey-cities"
import CityContext from '../context/CityContext'
function SelectCity() {
const { cities, city } = useTurkeyCities()
const { contextCity, setContextCity } = useContext(CityContext)
return (
<div>
<select
onChange={e => {
setContextCity(e.target.value);
}}
value={city}
>
{cities.map(city => (
<option key={`city-${city}`} value={city}>
{city}
</option>
))}
</select>
</div>
)
}
export default SelectCity
CityContext.js:
import { createContext, useState } from "react";
const CityContext = createContext()
export const CityProvider = ({children}) => {
const [contextCity, setContextCity] = useState(null)
const cityValues = {
contextCity,
setContextCity
}
return <CityContext.Provider value={cityValues}>{children}</CityContext.Provider>
}
export default CityContext
但我有 TypeError: render is not a function。怎么解决这个问题,我不明白
我解决了这个错误。
import CityProvider from './context/CityContext';
我将此代码更改为:
import {CityProvider} from './context/CityContext';