Coder Social home page Coder Social logo

hs3 / react-native-whc-calendar Goto Github PK

View Code? Open in Web Editor NEW

This project forked from netyouli/react-native-whc-calendar

0.0 1.0 0.0 492 KB

A react native module to show calendar, it works on iOS and Android. 跨平台日历组件支持iOS、Android

Home Page: https://github.com/netyouli/react-native-whcapp

License: MIT License

JavaScript 86.10% Python 3.41% Java 2.77% Objective-C 7.71%

react-native-whc-calendar's Introduction

react-native-whc-calendar

A react native module to show calendar, it works on iOS and Android.

release PRs Welcome NPM version License MIT 语言 中文

Content

Installation

  • 1.Run npm install react-native-whc-calendar --save
  • 2.import Calendar from 'react-native-whc-calendar'

Demo

Getting started

Add react-native-whc-calendar to your js file.

import Calendar from 'react-native-whc-calendar'

Inside your component's render method, use Calendar:

 render() {
         return (
             <Calendar
                 days={30}
             />
         );
 }

Basic usage

render() {
        return (
           <Calendar
               days={30}
               onSelectedDateBlock={(s,e) => {
                  /// 返回选择的日期
               }
           }/>
        );
    }

API

Props Type Optional Default Description
days PropTypes.number true 0 Specified date days
months PropTypes.number true 0 Specified date months
startYear PropTypes.number true 0 Specified date start year
endYear PropTypes.number true 0 Specified date end year
startDateStr PropTypes.string true null default choice start date
endDateStr PropTypes.string true null default choice end date
startSelectedHint PropTypes.string true null default choice start date hint
endSelectedHint PropTypes.string true null default choice end date hint
onSelectedDateBlock PropTypes.func true null choice date callback func
selectedColor PropTypes.string true null default choice date back color
selectedMidColor PropTypes.string true null default choice min date back color
selectedTextColor PropTypes.string true null default choice date text color
highlightColor PropTypes.string true null default date holiday color
enableSingleChoice PropTypes.bool true false enable single one date
invalidDateNotSelected PropTypes.bool true true default not choice invalid date

Contribution

Issues are welcome. Please add a screenshot of bug and code snippet. Quickest way to solve issue is to reproduce it on one of the examples.

Pull requests are welcome. If you want to change API or making something big better to create issue and discuss it first.


MIT Licensed

react-native-whc-calendar's People

Contributors

netyouli avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.