ReactJS - importēt kodu no cita faila

[maarc93]

Man ir Laravel projekts ar vairākiem skatiem un katram skatam ir savs ReactJS fails. Visos ReactJS failos atkārtojas kods ar menu izvēlni. Vai ir kāds vienkāršs veids, kā importēt ReactJS klasi no cita faila?

[daGrevis]

Paņem webpack un saliec kopā ar babel. https://webpack.js.org/guides/get-started/

Tad no JavaScript failiem varēsi rakstīt import { some, shit } from './stuff' un izmantot jaunās ES6 fīčas.

Edited June 6, 2017 by daGrevis

[aaxc]

Es personīgi React nepārzinu, bet vai viņam ir kāda liela atšķirība staro standarta JS failiem? Vismaz JS māk nolasīt funkcijas, kas definētas citā pievienotajā failā :/

[Wuu]

Visi cienoši sevi cilvēki kompilē javascriptu. Cik saprotu, cilvēks lieto ReactJS - kā jQuery? Un pie katra lapas pārlādes pa jaunu javascriptu ielāde no jauna? Atvainojos, varu derēt ka jQuery ari ir pieskrūvēts pilnam komplektam.

Kompilē ReactJS daļu atsevišķi, kā pienākas.

Edited June 5, 2017 by Wuu

[maarc93]

Esmu iesācējs iekš Javascript. Katru reizi lapas ielādē tiek ielādēts Javascript no jauna un jQuery arī ir. Kā vajag darīt pareizi? Ir kādi tutorials, kurus vari ieteikt? 

[Caaliitis]

https://facebook.github.io/react/docs/installation.html

Rekur ir instalācijas pamācība.

npm papildus vari izmantot Bower un Gulp

[maarc93]

paldies, viss skaidrs ar webpack, bet kā darīt gadījumā, ja aplikācijā ir paredzēti vairāki lietotāji un katram ir savs role. kā to padot uz JavaScript? šobrīd laravel blade padodu role_id un ar JS ielasu, bet to ir pārāk vienkārši apiet.

[daGrevis]

Serverim vienmēr ir jāčeko vai role ir pareiza. Klientā dari kā jau tagad dari - padot no servera role un attiecīgi parādi pareizo UI.

[maarc93]

bet UI tiek veidots ar React un viss kods atkal lietotājam redzams

[daGrevis]

So? Tu negribi to kodu kas dealo ar, teiksim, admin role, servot klientam, ja viņš nav admins?

[maarc93]

Jā, piemēram, sidebar ar izvēlnēm un dažas izvēlnes ir redzamas tikai priekš admin

Edited August 15, 2017 by maarc93

[jurgenzz]

Tādā gadījumā var mēģināt JS kodu, kas atbild par šīm funkcijām, var ielādēt no servera tikai attiecīgajiem lietotājiem, kurš attiecīgi pievienos papildus izvēlnes izvēlnei utt utjp.
 

[Wuu]

Ja lieto react-router v3, <Route to="/dashboardd" onEnter={} /> onEnter ļauj redirected lietotaju

Ja lieto react-router v4, var izmantot <Redirect /> komponentu

Ja nelieto, izveido componentu wraperi, kura render izkatās kaut kā šādi.

const Wrapper = ({isAdmin, children}) => {
    if (isAdmin === true) {
        return <div>{children}</div>
    }
    return <h1>You need to login</h1>
}

tad

const App = () =>
	<div>
		<Wrapper isAdmin={true}>
			<h1>Dashboard</h1>
		</Wrapper>
	</div>