34 lines
21 KiB
JavaScript
34 lines
21 KiB
JavaScript
|
define('docs/getting_started.md', function(require, exports, module) {
|
|||
|
|
|
|||
|
|
module.exports = {
|
|||
|
|
"title": "快速开始",
|
|||
|
|
"html": "<p>这是一个基于 React 框架的页面渲染器，有配置就能生成页面，配置是什么样的？请前往<a href=\"/amis/docs/basic\">基本用法</a>阅读。知道怎么配置后，就可以用以下方式用于自己的项目了。</p>\n<p>如果你不会 React 也没关系可以看看 <a href=\"#jssdk\">JSSDK 用法</a>。</p>\n<h2><a class=\"anchor\" name=\"%E5%AE%89%E8%A3%85%E4%BE%9D%E8%B5%96\" href=\"#%E5%AE%89%E8%A3%85%E4%BE%9D%E8%B5%96\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>安装依赖</h2><p>直接通过 npm 安装即可。</p>\n<pre><code><span class=\"hljs-built_in\">npm</span> i amis\n</code></pre><h2><a class=\"anchor\" name=\"%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8-\" href=\"#%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8-\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"octicon octicon-link\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>如何使用？</h2><p>可以在 React Component 这么使用。</p>\n<pre><code class=\"lang-tsx\"><span class=\"hljs-keyword\">import</span> * as <span class=\"hljs-type\">React</span> from <span class=\"hljs-symbol\">'reac</span>t';\n<span class=\"hljs-keyword\">import</span> {\n render as renderAmis\n} from <span class=\"hljs-symbol\">'ami</span>s';\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class</span> <span class=\"hljs-title\">MyComponent</span> <span class=\"hljs-keyword\">extends</span> <span class=\"hljs-title\">React</span>.<span class=\"hljs-title\">Component<any</span>, <span class=\"hljs-title\">any></span> </span>{\n render() {\n <span class=\"hljs-keyword\">return</span> (\n <div>\n <p>通过 amis 渲染页面</p>\n {renderAmis({\n <span class=\"hljs-comment\">// schema</span>\n <span class=\"hljs-comment\">// 这里是 amis 的 Json 配置。</span>\n <span class=\"hljs-class\"><span class=\"hljs-keyword\">type</span></span>: <span class=\"hljs-symbol\">'pag</span>e',\n title: '简单页面',\n body: '内容'\n }, {\n <span class=\"hljs-comment\">// props</span>\n }, {\n <span class=\"hljs-comment\">// env</span>\n <span class=\"hljs-comment\">// 这些是 amis 需要的一些接口实现</span>\n <span class=\"hljs-comment\">// 可以参考本项目里面的 Demo 部分代码。</span>\n\n updateLocation: (location:string<span class=\"hljs-comment\">/*目标地址*/</span>, replace:boolean<span class=\"hljs-comment\">/*是replace，还是push？*/</span>) => {\n <span class=\"hljs-comment\">// 用来更新地址栏</span>\n },\n\n jumpTo: (location:string<span class=\"hljs-comment\">/*目标地址*/</span>) => {\n <span class=\"hljs-comment\">// 页面跳转， actionType: link、url 都会进来。</span>\n },\n\n fetcher: ({\n url,\n method,\n data,\n config\n
|
|||
|
|
"toc": {
|
|||
|
|
"label": "目录",
|
|||
|
|
"type": "toc",
|
|||
|
|
"children": [
|
|||
|
|
{
|
|||
|
|
"label": "安装依赖",
|
|||
|
|
"fragment": "%E5%AE%89%E8%A3%85%E4%BE%9D%E8%B5%96",
|
|||
|
|
"fullPath": "#%E5%AE%89%E8%A3%85%E4%BE%9D%E8%B5%96",
|
|||
|
|
"level": 2
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"label": "如何使用？",
|
|||
|
|
"fragment": "%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8-",
|
|||
|
|
"fullPath": "#%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8-",
|
|||
|
|
"level": 2
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"label": "JSSDK",
|
|||
|
|
"fragment": "jssdk",
|
|||
|
|
"fullPath": "#jssdk",
|
|||
|
|
"level": 2
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
"level": 0
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
});
|