React Native基于webstorm开发出更快速的模板
2017-11-18 16:59
190 查看
今天呢,写一写东西。。。关于React Native的基于webStorm上面开发的模板:一方面在开发初期每次都是懒得打重复代码。。。然后跑到前面一个页面去复制,结果还得去删除,真的很烦恼呢。所有这个时候我简单的在webStorm开发上面进行模板的定义,这边就放出来给大家使用使用。
第一步 开启settings
第二步
第三步
第四步
第五步
效果图:
最后里面需要复制的源码放在这里:有需要的朋友可以使用一下;有兴趣的朋友加关注一下
/**
* desc:$testClassDescribe
* author:$testAuthor
* date: $testDate
*/
import React,{PropTypes}from 'react';
import {
StyleSheet,
View,
} from 'react-native';
export default class $testClassName extends React.Component {
constructor(props) {
super(props);
this.state = {
}
}
static propTypes = {
}
/**
* 初始化了状态之后,在第一次绘制 render() 之前
* (能够使用setState()来改变属性 有且只有一次)
*/
componentWillMount(){
}
/**
* 这个函数开始,就可以和 JS 其他框架交互了,例如设置计时 setTimeout 或者 setInterval,
* 或者发起网络请求。这个函数也是只被调用一次
* (能够使用setState()来改变属性 有且只有一次)
*/
componentDidMount(){
}
/**
* 输入参数 nextProps 是即将被设置的属性,旧的属性还是可以通过 this.props 来获取。在这个回调函数里面,你可以根据属性的变化,
* 通过调用 this.setState() 来更新你的组件状态,这里调用更新状态是安全的,并不会触发额外的 render()
* (能够使用setState()来改变属性 多次调用)
*/
componentWillReceiveProps(){
}
/**
* 当组件接收到新的属性和状态改变的话,都会触发调用 shouldComponentUpdate(...)
* (不能够使用setState()来改变属性 多次调用)
*/
shouldComponentUpdate(){
}
/**
* 如果组件状态或者属性改变,并且上面的 shouldComponentUpdate(...) 返回为 true,就会开始准更新组件
* (不能够使用setState()来改变属性 多次调用)
*/
componentWillUpdate(){
}
/**
* 调用了 render() 更新完成界面之后,会调用 componentDidUpdate() 来得到通知
* (不能够使用setState()来改变属性 多次调用)
*/
componentDidUpdate(){
}
/**
* 组件要被从界面上移除的时候,就会调用 componentWillUnmount()
* (不能够使用setState()来改变属性 有且只有一次调用)
*/
componentWillUnmount(){
}
render() {
return (
<View>
</View>
);
}
}
const styles = StyleSheet.create({
});
第一步 开启settings
第二步
第三步
第四步
第五步
效果图:
最后里面需要复制的源码放在这里:有需要的朋友可以使用一下;有兴趣的朋友加关注一下
/**
* desc:$testClassDescribe
* author:$testAuthor
* date: $testDate
*/
import React,{PropTypes}from 'react';
import {
StyleSheet,
View,
} from 'react-native';
export default class $testClassName extends React.Component {
constructor(props) {
super(props);
this.state = {
}
}
static propTypes = {
}
/**
* 初始化了状态之后,在第一次绘制 render() 之前
* (能够使用setState()来改变属性 有且只有一次)
*/
componentWillMount(){
}
/**
* 这个函数开始,就可以和 JS 其他框架交互了,例如设置计时 setTimeout 或者 setInterval,
* 或者发起网络请求。这个函数也是只被调用一次
* (能够使用setState()来改变属性 有且只有一次)
*/
componentDidMount(){
}
/**
* 输入参数 nextProps 是即将被设置的属性,旧的属性还是可以通过 this.props 来获取。在这个回调函数里面,你可以根据属性的变化,
* 通过调用 this.setState() 来更新你的组件状态,这里调用更新状态是安全的,并不会触发额外的 render()
* (能够使用setState()来改变属性 多次调用)
*/
componentWillReceiveProps(){
}
/**
* 当组件接收到新的属性和状态改变的话,都会触发调用 shouldComponentUpdate(...)
* (不能够使用setState()来改变属性 多次调用)
*/
shouldComponentUpdate(){
}
/**
* 如果组件状态或者属性改变,并且上面的 shouldComponentUpdate(...) 返回为 true,就会开始准更新组件
* (不能够使用setState()来改变属性 多次调用)
*/
componentWillUpdate(){
}
/**
* 调用了 render() 更新完成界面之后,会调用 componentDidUpdate() 来得到通知
* (不能够使用setState()来改变属性 多次调用)
*/
componentDidUpdate(){
}
/**
* 组件要被从界面上移除的时候,就会调用 componentWillUnmount()
* (不能够使用setState()来改变属性 有且只有一次调用)
*/
componentWillUnmount(){
}
render() {
return (
<View>
</View>
);
}
}
const styles = StyleSheet.create({
});
相关文章推荐
- iOS开发之旅--React native使用IDE推荐webstorm
- 基于gnu-arm-linux的LPC2220的简单工程模板 分类: 嵌入式开发学习 2014-08-04 21:52 397人阅读 评论(0) 收藏
- 基于WebStorm, React和Ant.Design开发WebAppDemo
- 国内首部基于JBPM5.4实战流程引擎开发(动态表单、模板引擎、公文管理系统)
- iOS开发005 OpenCV--基于模板图片的标记识别
- 基于WebStorm, React和Ant.Design开发WebAppDemo
- 前端基于react,后端基于.net core2.0的开发之路(番外篇) 后端使用T4模板,生成某些类
- 基于BIM铝模板REVIT二次开发之楼面板快速布置
- 使用WebStorm 开发React Native Android APP的配置
- 针对在webstorm开发React Native的代码快捷设置
- [工具开发] 分享两个基于Heapster 和 Influxdb 的 Grafana 监控仪表盘模板
- java与设计模式(六)-模板方法二基于项目开发
- office开发心得——基于模板开发
- 《国内首部基于JBPM5.4实战流程引擎开发(动态表单、模板引擎、公文管理系统)》
- 基于Velocity开发自己的模板引擎
- 基于jQuery开发的javascript模板引擎-jTemplates
- 基于HTML5 Bootstrap搭建的后台模板,分页,模糊查询已经全部JS实现,无需编码,嵌入数据即可开发,内置8款皮肤,欧美风格,非常好用!
- Weex基于Vue2.0开发框架模板搭建
- react native 之 webstorm开发(windows)
- React Native开发一 webstorm搭建React Native开发环境