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"],
"bsc-flags": [
"-bs-super-errors"
]
],
"refmt": 3
}

View file

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

View file

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

View file

@ -2,18 +2,21 @@
"name": "with-reasonml",
"version": "1.0.0",
"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",
"start": "bsb -clean-world -make-world && next start -w"
},
"license": "ISC",
"dependencies": {
"babel-plugin-bucklescript": "^0.2.3-1",
"bs-platform": "^1.9.3",
"concurrently": "^3.5.0",
"next": "^3.2.2",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"reason-react": "^0.2.3"
"babel-plugin-bucklescript": "^0.2.4",
"next": "^4.1.4",
"react": "^16.1.1",
"react-dom": "^16.1.1",
"reason-react": "^0.3.0"
},
"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 make _children => {
let component = ReasonReact.statelessComponent("About");
let make = (_children) => {
...component,
render: fun _self => {
render: (_self) =>
<div>
<Header />
<p>(ReasonReact.stringToElement "This is the about page.")</p>
<p> (ReasonReact.stringToElement("This is the about page.")) </p>
<Counter />
</div>
}
};
let jsComponent =
ReasonReact.wrapReasonForJs
::component
(fun _jsProps => make [||])
let jsComponent = ReasonReact.wrapReasonForJs(~component, (_jsProps) => make([||]));

View file

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