why
- 弱文档化
- 提效
- 一定程度上统一代码风格(最好配合统一的代码规范一起,如eslint,standardJS)
功能
[x] 一键支持magix3常用语法
[x] 对常见的magix-gallery组件使用抽象成代码片段
[x] 对adv,pub自带的一些常用组件抽象成代码片段
API
语法类
html语法标签
| 快捷键 |
描述 |
代码片段 |
| = |
输入变量,进行xss转译 |
{{=}} |
| ! |
输入变量,不进行xss转译 |
{{!}} |
| @ |
插入一个对象的变量 |
{{@}} |
| if |
if模版 |
{{if}}{{/if}} |
| ife |
if esle模版 |
{{if}}{{else}{{/if} |
| each |
each遍历模版 |
{{each $1 as $2 i}}$3{{/each}} |
| mx-view |
子区块的html代码 |
|
js语法模版
⚠️这里的关于路由的语法是基于magix-router的语法,而非magix3自带的router
| 快捷键 |
描述 |
代码片段 |
| mi |
初始化出一个magix模版 |
|
| mu |
magix更新页面 |
this.updater.digest() |
| msu |
magix更新页面并更新数据 |
this.updater.set({}).digest() |
| mf |
magix的过滤器 |
filters{", "$1", "}, |
| mx-fetch |
magix配套的fetch请求方法 |
|
| muq |
magix 更新url的query的方法 |
|
| mq |
magix获取url的query的方法 |
const {} = this.route.query |
| mg |
magix从updater获取数据的方法 |
const {} = this.updater.get() |
| mx-onchange |
magix常用的onchange模版 |
|
| mx-onclick |
magix常用的onclick模版 |
|
| mx-view |
magix常用的加载子view方法 |
|
magix-gallery
快速生成对应的组件magix-gallery的区块代码,具体文档请移步
组件html代码
组件js代码
gallery-local
快速生成对应的本地组件库gallery-localy的区块代码,具体文档请参考自己项目的文档
组件html代码
| 快捷键 |
描述 |
对应的magix-gallery组件 |
| lg-download |
下载按钮的html代码区块 |
lg-download |
| lg-snippets.tip |
提示文案的html代码区块 |
lg-snippets.tip |
| lg-snippets.breadcrumb |
面包屑的html代码区块 |
lg-snippets.breadcrumb |
| |