這是在 Class 組件內部（d 是回傳日期物件，set 是設定組件）
Maanantai = new DayLayout(d.state.maanantai)
Tiistai = new DayLayout(d.state.tiistai)
Keskiviikko = new DayLayout(d.state.keskiviikko)
Torstai = new DayLayout(d.state.torstai)
Perjantai = new DayLayout(d.state.perjantai)
Lauantai = new DayLayout(d.state.lauantai)
Sunnuntai = new DayLayout(d.state.sunnuntai)
set = new Settings
return (
<div>
<div><h3>Otsikko palkki</h3></div>
{(() => {
if (set.getWeekstart != "Maanantai") {
return (
<Sunnuntai/>
)
}
})()}
<Maanantai/>
<Tiistai/>
<keskiviikko/>
<Torstai/>
<Perjantai/>
<Lauantai/>
{(() => {
if (set.getWeekstart == "Maanantai") {
return (
<Sunnuntai/>
)
}
})()}
</div>
);
我正在嘗試呈現多個作業日表。VisualStudio 代碼如何顯示此代碼中的錯誤并且無法正常作業。不知何故，它不接受新類作為物件，是否有來自類物件的來源和組件？
uj5u.com熱心網友回復：
代替
{(() => {
if (set.getWeekstart != "Maanantai") {
return (
<Sunnuntai/>
)
}
})()}
用這個
{set.getWeekstart != "Maanantai" && <Sunnuntai/> }
或者
{set.getWeekstart != "Maanantai" ? <Sunnuntai/> : null}
uj5u.com熱心網友回復：
您可以嘗試的一些方法
const SomeComponent = (props) => {
// if you dont want new Settings() to be called on every render
const settings = useMemo(() => {
return new Settings()
}, []) // dependencies for settings or just move settings out of the component
const Tiistai = useMemo(() => {
// if you need to construct the component in a specific way
// const propsCreator = new DayLayout(d.state.tiistai)
// return (props) => <RenderComponent {...props} {...propsCreator.getProps() } />
return (props) => <DayLayout {...props} state={d.state.tiistai} />
}, [d.state.tiistai])
return (
...
// approach one
<Maanantai state={d.state.maanantai} />
// approach two
<Tiistai/>
...
)
}
希望它能以某種方式幫助你
uj5u.com熱心網友回復：
讓它作業，謝謝所有的回復，他們非常有幫助：
import React from "react";
import DayLayout from "./komponentit/day";
import Settings from "./settings"
import Dates from "./komponentit/dates";
var n = new date();
var d = new Dates(n)
//Eli daylayout tarvii tiet?? milloinkin aktiivisen viikon
//pit?? hakea pvm atlasianiasta tai hakea nykyinen viikk
set = new Settings
class ViikkoLayout extends React.Component {
state = {
Projektit: '',
Tasks: '',
pvm: '',
date: '',
week: ''
};
/*const [columns, setColumns] = useState(columns);*/
// Pit?? editoida t?h?n asetusten mukainen muutos onko MA vai SU ekapaiva
render() {
return (
<div>
<h3>Otsikko palkki</h3>
{set.getWeekstart != "Maanantai" && <DayLayout day={...d.state.sunnuntai}/> }
<DayLayout day={...d.state.maanantai}/>
<DayLayout day={...d.state.tiistai}/>
<DayLayout day={...d.state.keskiviikko}/>
<DayLayout day={...d.state.torstai}/>
<DayLayout day={...d.state.perjantai}/>
<DayLayout day={...d.state.lauantai}/>
{set.getWeekstart == "Maanantai" && <DayLayout day={...d.state.sunnuntai}/> }
</div>
)
}
}
export default ViikkoLayout;
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/536987.html
標籤：反应
上一篇：如何用變數陣列做清單？