您的位置:首页 > Web前端 > React

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

});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  React Native