Update
This commit is contained in:
parent
f18051338f
commit
006fac7c97
|
@ -0,0 +1,103 @@
|
||||||
|
---
|
||||||
|
title: Mobx
|
||||||
|
category: JavaScript libraries
|
||||||
|
---
|
||||||
|
|
||||||
|
### Properties
|
||||||
|
|
||||||
|
```js
|
||||||
|
import {observable, computed} from 'mobx'
|
||||||
|
|
||||||
|
class Page {
|
||||||
|
@observable title = ''
|
||||||
|
@observable published = false
|
||||||
|
|
||||||
|
@computed get authorName () {
|
||||||
|
return this.author || 'Anonymous'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Actions
|
||||||
|
|
||||||
|
```js
|
||||||
|
class Page {
|
||||||
|
@action publish () {
|
||||||
|
this.published = true
|
||||||
|
// do ajax/async here if you like
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Plain objects
|
||||||
|
|
||||||
|
```js
|
||||||
|
const person = observable({
|
||||||
|
name: 'Ella Fitzgerald'
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
```js
|
||||||
|
const temp = observable(23)
|
||||||
|
temp.get()
|
||||||
|
temp.set(25)
|
||||||
|
temp.observe(...)
|
||||||
|
```
|
||||||
|
|
||||||
|
## Reactions
|
||||||
|
|
||||||
|
```js
|
||||||
|
import {autorun, autorunAsync, when} from 'mobx'
|
||||||
|
```
|
||||||
|
|
||||||
|
### autorun()
|
||||||
|
|
||||||
|
```js
|
||||||
|
// Runs it, finds out what it accessed, then observe those
|
||||||
|
autorun(() => {
|
||||||
|
console.log(page.title)
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
### when()
|
||||||
|
|
||||||
|
```js
|
||||||
|
class Foo {
|
||||||
|
constructor () {
|
||||||
|
when(
|
||||||
|
() => !this.isVisible,
|
||||||
|
() => this.doSomething())
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## React
|
||||||
|
|
||||||
|
```js
|
||||||
|
import { observer } from 'mobx-react'
|
||||||
|
|
||||||
|
@observer
|
||||||
|
class PageView extends React.Component {
|
||||||
|
render () {
|
||||||
|
return <div>{this.props.page.title}</div>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
<PageView page={page} />
|
||||||
|
```
|
||||||
|
|
||||||
|
### Functional components
|
||||||
|
|
||||||
|
```js
|
||||||
|
import { observer } from 'mobx-react'
|
||||||
|
|
||||||
|
const PageView = observer(({page}) => {
|
||||||
|
<div>{page.title}</div>
|
||||||
|
})
|
||||||
|
|
||||||
|
<PageView page={page} />
|
||||||
|
```
|
||||||
|
|
||||||
|
## References
|
||||||
|
|
||||||
|
- <https://github.com/mobxjs/mobx>
|
|
@ -0,0 +1,53 @@
|
||||||
|
---
|
||||||
|
title: Parsimmon
|
||||||
|
category: JavaScript libraries
|
||||||
|
---
|
||||||
|
|
||||||
|
```js
|
||||||
|
const P = require('parsimmon')
|
||||||
|
|
||||||
|
P.regexp(/[a-z]+/)
|
||||||
|
.parse('hello')
|
||||||
|
//=> { status: true, value: ['hello'] }
|
||||||
|
```
|
||||||
|
|
||||||
|
## Atoms
|
||||||
|
|
||||||
|
```js
|
||||||
|
P.regexp(/[a-z]+/)
|
||||||
|
P.string('hello')
|
||||||
|
P.oneOf('abc') // like P.regexp(/[abc]/)
|
||||||
|
|
||||||
|
P.whitespace
|
||||||
|
P.optWhitespace
|
||||||
|
P.eof
|
||||||
|
```
|
||||||
|
|
||||||
|
## Combinators
|
||||||
|
|
||||||
|
```js
|
||||||
|
P.seq(a, b, c) // sequence of these
|
||||||
|
P.alt(a, b) // any of these
|
||||||
|
P.sepBy(a, P.string(',')) // sequence of `a`, separated by ','
|
||||||
|
P.sepBy1(a, P.string(',')) // same, at least once
|
||||||
|
|
||||||
|
a.or(b) // like P.alt(a, b)
|
||||||
|
a.skip(b) // parses `b` but discards it
|
||||||
|
|
||||||
|
a.many()
|
||||||
|
a.times(3)
|
||||||
|
a.times(1, 4) // 1 <= x <= 4
|
||||||
|
a.atMost(10)
|
||||||
|
a.atLeast(10)
|
||||||
|
```
|
||||||
|
|
||||||
|
## Formatting
|
||||||
|
|
||||||
|
```js
|
||||||
|
P.seq(P.number, P.oneOf('+-*/'), P.number)
|
||||||
|
.map(([left, oper, right]) => ({ oper, left, right }))
|
||||||
|
```
|
||||||
|
|
||||||
|
## Reference
|
||||||
|
|
||||||
|
- <https://github.com/jneen/parsimmon/blob/master/API.md>
|
Loading…
Reference in New Issue