VS Code 用户自定义代码片段(React)
2024-09-02 12:51:01
VS Code 用户自定义代码片段(React)
.jsxReact组件模板:javascriptreact.json
{
"Import React": {
"prefix": "importreact",
"body": [
"import React from 'react'\n",
"class ${1:${TM_FILENAME/(.*).(?:jsx|js)/$1/i}} extends React.Component {",
" render () {",
" return (",
" ${2|null|}",
" )",
" }",
"}\n",
"export default ${1:${TM_FILENAME/(.*).(?:jsx|js)/$1/i}}\n"
],
"description": "引入React基本组件"
},
"Import PropTypes": {
"prefix": "importproptypes",
"body": [
"import PropTypes from 'prop-types'"
],
"description": "引入prop-types"
},
"Define defaultProps": {
"prefix": "defaultProps",
"body": [
"static defaultProps = {",
" $1",
"}\n"
]
}
}
.jsredux模板：javascript.json
{
"Import Redux Action": {
"prefix": "importaction",
"body": [
"import { ${1|handleActions,createAction|} } from 'redux-actions'"
],
"description": "导入redux-actions"
},
"Create Reducer": {
"prefix": "reducer",
"body": [
"import { handleActions } from 'reduce-actions'",
"import * as ${1:types} from '@/constants/${2:${TM_FILENAME/(.*)State.(?:jsx|js)/$1Const/i}}'\n",
"const ${3:initState} = {",
"\t$4",
"}\n",
"export default handleActions({",
"\t$5",
"}, ${3:initState})\n"
],
"description": "导入一个reducer模板"
},
"Create Action": {
"prefix": "action",
"body": [
"import { ${1|createAction, createActions|} } from 'redux-actions'",
"import * as ${2:types} from '@/constans/${3:${TM_FILENAME/(.*)Action.(?:jsx|js)/$1Const/i}}'\n",
"$0"
]
}
}
最新文章
- 通过维基API实现维基百科查询功能
- 在 CentOS7 上部署 zookeeper 服务
- Visual Studio 2015 Pre Secondary Installer 在哪里
- css背景图
- Java工厂设计模式
- php获取网页中图片并保存到本地的代码
- ffmpeg 打开视频流太慢（上）
- [King.yue]EXT.NET TextFieldFor添加正则表达式
- 阿里云centOS6 下python安装及配置、pip安装及配置、ipython安装及配置
- C语言中的宏
- openStack ceilometer API
- ARM指令集——条件执行、内存操作指令、跳转指令
- Android 之Activity切换动画效果
- [译]Java 垃圾回收的监控和分析
- UX是什么？
- sqlserver2012 在视图中建索引
- 交互课件用什么软件------承接教育类k12/幼儿html5交互课件/动画外包
- 利用Ajax和JSON实现关于查找省市名称的二级联动功能
- JS列表
- 微信小程序通过js动态修改css样式的方法（交流QQ群：604788754）