Write less code, do more things!

文档

use cacache

基础使用

markdown

var Calling = require('calling')
import React , { Component } from "react"
class Basic extends Component {
    constructor(props) {
        super(props)
    }
    static actions () {
        return {
            'some': function (payload, ca) {
                console.log(payload)
                ca.set('some', Math.random())
            }
        }
    }
    render() {
        const self = this
        const ca = self.props.ca
        const store = ca.value()
        return (
            <div>
                <button
                    onClick={() => {
                        ca.action('some', {data:1})
                    }}
                >action('some')</button>
                <button
                    onClick={function (){
                        ca.set('name', 'nimo' + Math.random())
                        ca.set('nickname', 'cute ' + ca.get('name'))
                    }}
                >
                    set props sync
                </button>
                <button
                    onClick={function (){
                        self.setState({
                            name: 'nimo' + Math.random()
                        })
                        self.setState({
                            nickname: 'cute ' + self.state.name
                        })
                    }}
                >
                    set state sync (throw error)
                </button>
                <pre>state:{JSON.stringify(self.state, null, 4)}</pre>
                <pre>store:{JSON.stringify(store, null, 4)}</pre>
                <hr />
                <button
                    onClick={() => {
                        ca.set('one', Math.random())
                    }}
                >set</button>
                {' '}
                <button
                    onClick={() => {
                        ca.set(
                            'list[{name:"nimo"}]',
                            {
                                random: Math.random()
                            }
                        )
                    }}
                >{`list[{name:"nimo"}]`}</button>
                {' '}
                <button
                    onClick={() => {
                        ca.delete(
                            'list[{name:"nico"}]'
                        )
                    }}
                >{`delete list[{name:"nico"}]`}</button>
                {' '}
                <button
                    onClick={() => {
                        ca.push(
                            'list',
                            {
                                new: Math.random()
                            }
                        )
                    }}
                >push</button>
                {' '}
                <button
                    onClick={() => {
                        ca.unshift(
                            'list',
                            {
                                new: Math.random()
                            }
                        )
                    }}
                >unshift</button>
                {' '}
                <button
                    onClick={() => {
                        ca.replace(
                            'list[{name:"nimo"}]',
                            {
                                replace: Math.random()
                            }
                        )
                    }}
                >replace</button>
                {' '}
                <hr />
                <code>
                {`get('list[{name:"nimo"}].age')`} // {ca.get('list[{name:"nimo"}].age')}
                </code>
                <hr />
                <code>
                {`getAll('list[{name:"nimo"}]')`} // {
                    JSON.stringify(
                        ca.getAll('list[{name:"nimo"}]')
                    )
                }
                </code>
            </div>
        )
    }
}
Basic.defaultProps = {
    store: {
        one: 'abc',
        list: [
            {
                name: 'nimo',
                age: 25
            },
            {
                name: 'nico',
                age: '18'
            },
            {
                name: 'nimo',
                gender: 'male'
            }
        ]
    }
}
Basic = Calling.createReact(Basic)

module.exports = Basic

Github
calling - 项目源码
相关站点
component-spec - 组件规范
module - 开源项目脚手架
onface.cc - 资源集合