mirror of
https://github.com/encounter/react-add-to-calendar.git
synced 2026-07-10 21:18:44 -07:00
Update example code to use React Class syntax (#16)
* Update to use React Class syntax This is the recommended syntax to use now, and as such will be more familiar to beginners. :) * Converted old requires to import statements.
This commit is contained in:
committed by
Jason Salzman
parent
66d602884b
commit
17efec9b08
@@ -20,29 +20,25 @@ npm install react-add-to-calendar --save
|
|||||||
You’ll need to install React and Moment separately since they are not included in the package. Below is a simple example on how to use the Add to Calendar button in a React view.
|
You’ll need to install React and Moment separately since they are not included in the package. Below is a simple example on how to use the Add to Calendar button in a React view.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
var React = require('react');
|
import React from 'react';
|
||||||
var createReactClass = require('create-react-class');
|
import AddToCalendar from 'react-add-to-calendar';
|
||||||
var AddToCalendar = require('react-add-to-calendar');
|
|
||||||
|
|
||||||
var Example = createReactClass({
|
class Example extends React.Component {
|
||||||
displayName: 'Example',
|
static displayName = 'Example';
|
||||||
|
state = {
|
||||||
|
event: {
|
||||||
|
title: 'Sample Event',
|
||||||
|
description: 'This is the sample event provided as an example only',
|
||||||
|
location: 'Portland, OR',
|
||||||
|
startTime: '2016-09-16T20:15:00-04:00',
|
||||||
|
endTime: '2016-09-16T21:45:00-04:00'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
getInitialState: function() {
|
render() {
|
||||||
return {
|
|
||||||
event: {
|
|
||||||
title: 'Sample Event',
|
|
||||||
description: 'This is the sample event provided as an example only',
|
|
||||||
location: 'Portland, OR',
|
|
||||||
startTime: '2016-09-16T20:15:00-04:00',
|
|
||||||
endTime: '2016-09-16T21:45:00-04:00'
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
render: function() {
|
|
||||||
return <AddToCalendar event={this.state.event}/>;
|
return <AddToCalendar event={this.state.event}/>;
|
||||||
}
|
};
|
||||||
});
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
## Configuration
|
## Configuration
|
||||||
|
|||||||
Reference in New Issue
Block a user