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 |
| |