reason

How to compose props across component in reason-react bindings?

梦想的初衷 提交于 2021-02-07 20:22:08
问题 I am currently writing a material-UI reason-react binding and I want to know how I can re-use previously define Props. The Select component spreads all of the Input props into itself, in the underlying react-js lib. this is done by spreading props however this is discouraged in ReasonML as typings are lost. As a temporary solution, I have copied the props from one to another but this is not scalable. I would appreciate if someone could suggest what is the correct way of doing this in Reason

Can I make Reason+React import react module from CDN?

淺唱寂寞╮ 提交于 2021-02-05 09:15:27
问题 Building a component with Reason and React always gives me an module import statement for "react", which cannot be found if React is included from a CDN. Is there a solution for this? I've tried to define window.react = React in index.html without success. es6-global setting does not change anything. I'm not using a bundling program like webpack. Edit: Possibly relevant thread from Reason forum: https://reasonml.chat/t/can-one-load-reasonml-es6-modules-without-a-bundler/2219 Similar issue

can one load reasonml es6 modules without a bundler

孤者浪人 提交于 2021-01-29 17:10:57
问题 I am trying to use my VSCODDE liver server: https://github.com/ritwickdey/vscode-live-server for development without having to run a (parceljs would be my favorite, since it has hot loading, but it is having issues with reasonml). This almost works, but the the bucklescript compiler expects that the the node-modules to be on the path, and it appears bundlers find them, but not if one does a load this way: es5index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset=utf-8> <link rel

Append an element at the end of a list [duplicate]

拥有回忆 提交于 2020-05-16 07:42:16
问题 This question already has an answer here : how to populate existing list / array (1 answer) Closed 2 years ago . How to append an element at the end of a list in ReasonML (the equivalent of Array.concat in JavaScript)? 回答1: While Neil's answer is technically correct, it glosses over some details that you might want to consider before reaching for append ; specifically that while adding an element to the beginning of a list is very cheap, adding an element to the end is very expensive. To

How does fillStyle work in bs-webapi Canvas2d

偶尔善良 提交于 2020-01-25 09:28:07
问题 I'm wondering how to create a and set a fill style using bs-webapi and Canvas2d interface in ReasonML. I think the definition I might need is this: let fillStyle = (ctx: t) => ctx |> fillStyle |> reifyStyle; But I'm having trouble understanding it. I have previously used this project as a source of examples, but I think the bs-webapi has changed since that project was authored. At least the following line modeled after the example: Canvas2d.fillStyle(ctx, "rgba(0,255,255,255)"); gives me this

Unbound record field name in Reason Component

我只是一个虾纸丫 提交于 2020-01-05 04:24:09
问题 Borrowing just about all of Yawar's helpful answer, I have the following: $cat src/index.re let products = [| {name: "Football", price: 49.99}, {name: "Basebll", price: 1.99}, {name: "Poker", price: 33.99} |]; ReactDOMRe.renderToElementWithId( <ProductTable products /> ); $cat src/productRow.re let component = ReasonReact.statelessComponent("ProductRow"); let echo = ReasonReact.stringToElement; let make = (~name: string, ~price: float, _) => { ...component, render: (_) => { <tr> <td>{echo

How to conditionally set HTML attributes in JSX using reason-react?

此生再无相见时 提交于 2020-01-04 06:50:14
问题 I want to render an HTML checkbox whose checked state is controlled by data. Give a stateless component that receives an item type { label: string, checked: bool} , Like so: let component = ReasonReact.statelessComponent("TodoItem"); let make = (~item, _children) => { render: _self => { <li> <input type_="checkbox" {/*looking for something like this*/ item.checked ? "checked" : "" /* doesn't compile */}/> {ReasonReact.string(item.label)} </li> } } How do I add the presence of the attribute

How to add a copyright symbol in reason-react component?

喜夏-厌秋 提交于 2020-01-03 16:45:01
问题 I’m new to reason-react. I’m trying to put a copyright symbol in a react-reason component. I've tried <span >(ReasonReact.stringToElement("©"))</span> but this doesn’t give me the © symbol. 回答1: It's also possible, and usually simpler, to just use the unicode character: let copy = ReasonReact.stringToElement({js|\u00a9|js}); // Since ReasonReact 0.7.0 you can use let copy = React.string({js|\u00a9|js}); Or even shorter: let copy = [%raw {|'\u00a9'|}]; It's also possible to use unicode

How to bind to and use a higher-order component in ReasonReact

与世无争的帅哥 提交于 2020-01-01 12:17:32
问题 Let's say I have a higher-order component, something like the following trivial definition, exported from the JavaScript module ./hoc.js : export const withStrong = Component => props => <strong> <Component ...props/> </strong> Assuming I have some component called HelloMessage , what is the equivalent of this piece of JavaScript: import { withStrong } from './hoc.js'; const HelloMessage = ... const StrongMessage = withStrong(HelloMessage); ReactDOM.render( <StrongMessage name="Joe" />,

how to populate existing list / array

℡╲_俬逩灬. 提交于 2019-12-30 13:55:31
问题 I am new at reason / ocaml / functional programming. I know about List.append and [] @ [] but these functions will create new list but how to populate existing list / array? What is the best way to populate list? What is the best way to populate array? Means if coords type is let coords: array point = []; Or this is wrong flow (algorithm) for such case? Reason code: type point = {x: int, y: int}; let coords: list point = []; let append raw => Array.iter ( fun data => { let p = {x: data.x, y: