react-native 日历(react-native-ocalendar)

react-native-ocalendar是我头一次封装npm组件,有点小激动。
不多说走起!

github地址:https://github.com/ct535101351/react-native-ocalendar

react-native-ocalendar

1.npm install react-native-ocalendar --save

2.在App.jsimport MinimalismCalendar from 'react-native-ocalendar'

3.源码:

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Image,
  TouchableOpacity,
  Alert
} from 'react-native';

import MinimalismCalendar from 'react-native-ocalendar';
export default class App extends Component {
  constructor(props){
     super(props)
     this.state={
        data:"未传值"
     }
     this.DateTransfer=this.DateTransfer.bind(this)
  }
  //数据设置
  DateTransfer(cont){
    // Alert.alert(cont)
     this.setState({
        data:cont[0]+'-'+cont[1]+'-'+cont[2]
     })
  }
  
  render() {

    return (
      
          {}}>
              {this.state.data}
          
         
      
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#F5FCFF',
    marginTop: 30
  }
});

效果图

Demonstration.gif
有什么好的建议可以随时留言或者私聊都可以!!!
友情提示:在开发中有遇到RN相关的技术问题,欢迎小伙伴加入交流群(620792950),在群里提问、互相交流学习。交流群也定期更新最新的RN学习资料给大家,谢谢大家支持!

你可能感兴趣的:(react-native 日历(react-native-ocalendar))