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