1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00

Update reason example to version 3 syntax and fix errors (#3347)

* update dependencies

* add bsconfig refmt version

* update to new syntax

* add dependency on concurrently for dev convenience

* fix dev script
This commit is contained in:
Adrian Li 2017-11-28 05:15:03 -08:00 committed by Tim Neutkens
parent c9401214db
commit f9c6e12037
6 changed files with 48 additions and 48 deletions

View file

@ -6,5 +6,6 @@
"package-specs": ["commonjs"], "package-specs": ["commonjs"],
"bsc-flags": [ "bsc-flags": [
"-bs-super-errors" "-bs-super-errors"
] ],
"refmt": 3
} }

View file

@ -1,21 +1,22 @@
type action = type action =
| Add; | Add;
let component = ReasonReact.reducerComponent "Counter"; let component = ReasonReact.reducerComponent("Counter");
let make _children => { let make = (_children) => {
...component, ...component,
initialState: fun () => 0, initialState: () => 0,
reducer: fun action state => reducer: (action, state) =>
switch action { switch action {
| Add => ReasonReact.Update {state + 1} | Add => ReasonReact.Update(state + 1)
}, },
render: fun self => { render: (self) => {
let countMsg = "Count: " ^ (string_of_int self.state); let countMsg = "Count: " ++ string_of_int(self.state);
<div> <div>
<p> (ReasonReact.stringToElement countMsg) </p> <p> (ReasonReact.stringToElement(countMsg)) </p>
<button onClick=(self.reduce (fun _event => Add))> (ReasonReact.stringToElement "Add") </button> <button onClick=(self.reduce((_event) => Add))>
(ReasonReact.stringToElement("Add"))
</button>
</div> </div>
} }
}; };

View file

@ -1,13 +1,12 @@
let component = ReasonReact.statelessComponent "Header"; let component = ReasonReact.statelessComponent("Header");
let styles = ReactDOMRe.Style.make
marginRight::"10px" let styles = ReactDOMRe.Style.make(~marginRight="10px", ());
();
let make _children => { let make = (_children) => {
...component, ...component,
render: fun _self => { render: (_self) =>
<div> <div>
<a href="/" style=styles> (ReasonReact.stringToElement "Home") </a> <a href="/" style=styles> (ReasonReact.stringToElement("Home")) </a>
<a href="/about" style=styles> (ReasonReact.stringToElement "About") </a> <a href="/about" style=styles> (ReasonReact.stringToElement("About")) </a>
</div> </div>
} };
};

View file

@ -2,18 +2,21 @@
"name": "with-reasonml", "name": "with-reasonml",
"version": "1.0.0", "version": "1.0.0",
"scripts": { "scripts": {
"dev": "concurrently \"bsb --clean-world -make-world -w\" \"next -w\"", "dev": "concurrently \"bsb -clean-world -make-world -w\" \"next -w\"",
"build": "bsb -clean-world -make-world && next build", "build": "bsb -clean-world -make-world && next build",
"start": "bsb -clean-world -make-world && next start -w" "start": "bsb -clean-world -make-world && next start -w"
}, },
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"babel-plugin-bucklescript": "^0.2.3-1", "babel-plugin-bucklescript": "^0.2.4",
"bs-platform": "^1.9.3", "next": "^4.1.4",
"concurrently": "^3.5.0", "react": "^16.1.1",
"next": "^3.2.2", "react-dom": "^16.1.1",
"react": "^15.6.1", "reason-react": "^0.3.0"
"react-dom": "^15.6.1", },
"reason-react": "^0.2.3" "devDependencies": {
"bs-platform": "^2.1.0",
"concurrently": "^3.5.1",
"webpack": "^3.8.1"
} }
} }

View file

@ -1,15 +1,13 @@
let component = ReasonReact.statelessComponent "About"; let component = ReasonReact.statelessComponent("About");
let make _children => {
let make = (_children) => {
...component, ...component,
render: fun _self => { render: (_self) =>
<div> <div>
<Header /> <Header />
<p>(ReasonReact.stringToElement "This is the about page.")</p> <p> (ReasonReact.stringToElement("This is the about page.")) </p>
<Counter /> <Counter />
</div> </div>
}
}; };
let jsComponent =
ReasonReact.wrapReasonForJs let jsComponent = ReasonReact.wrapReasonForJs(~component, (_jsProps) => make([||]));
::component
(fun _jsProps => make [||])

View file

@ -1,15 +1,13 @@
let component = ReasonReact.statelessComponent "Index"; let component = ReasonReact.statelessComponent("Index");
let make _children => {
let make = (_children) => {
...component, ...component,
render: fun _self => { render: (_self) =>
<div> <div>
<Header /> <Header />
<p>(ReasonReact.stringToElement "HOME PAGE is here!")</p> <p> (ReasonReact.stringToElement("HOME PAGE is here!")) </p>
<Counter /> <Counter />
</div> </div>
}
}; };
let jsComponent =
ReasonReact.wrapReasonForJs let jsComponent = ReasonReact.wrapReasonForJs(~component, (_jsProps) => make([||]));
::component
(fun _jsProps => make [||])