Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hi. i cleaned it up. #15

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 27 additions & 20 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,39 +1,42 @@
# React Google Analytics
# React Google Analytics 反应Google Analytics
反应谷歌分析的反应路由器。 如果需要Google Analytics(分析)之类的功能,就可以使用。

[![NPM version][npm-image]][npm-url]

[npm-image]: https://img.shields.io/npm/v/react-g-analytics.svg?style=flat-square
[npm-url]: https://www.npmjs.com/react-g-analytics
[github-url]: https://github.com/seeden/react-g-analytics

## Motivation
## motivation 动机

I needed google analytics working in combination with react-router.
Google analytics works with react router

## Install
```sh
## install 安装

```
npm install react-g-analytics
```

## Features
## features

* Automatically load google analytics scripts (optional - id parameter)
* Automatically send pageview when user will change current route of react-router
* load google analytics scripts (optional - needs an id parameter)
* send pageview when user will change route of script

# Support us
###### support us

Star this project on [GitHub][github-url].

## Notice

Use version 0.3.x of the react-g-analytics if you want to use it with react-router 4.x
Use version 0.2.x of the react-g-analytics if you want to use it with react-router 2.x or 3.x
It should be good owtherwise

## Usage
## Usage 该代码的用法

### Example react-router 4.x

User BrowserRouter from react-g-analytics instead of react-router.
User uses BrowserRouter from react-g-analytics instead...

```js
import { BrowserRouter } from 'react-g-analytics';
Expand All @@ -51,15 +54,19 @@ export default function MyComponent() {

### Example react-router 3.x and bellow

### App.jsx
#### App.jsx

Application part (load google analytics script to your webpage on the client side).
ReactGAnalytics has parameter ID (use your own ID)
Application part (load google analytics script at your webpage on the client side).
this code has parameter ID (use your own ID)

```js
var React = require('react');


var GoogleAnalytics = require('react-g-analytics');



var App = module.exports = React.createClass({
render: function() {
return (
Expand All @@ -72,7 +79,7 @@ var App = module.exports = React.createClass({
});
```

### routes.jsx
### routes.jsx 路线

Define your routes here.

Expand All @@ -91,7 +98,7 @@ var routes = module.exports = (
);
```

### client.js
### client.js 客户

Here is a simple client side

Expand All @@ -109,7 +116,7 @@ router.run(function(Handler, state) {
});
```

## Set
## Set

If you want to set google analytics parameters after load you can use property named set. Here is small example:

Expand All @@ -134,12 +141,12 @@ var App = module.exports = React.createClass({
});
```

## Skip loading google analytics scripts
## Skip loading google analytics scripts 跳过加载谷歌分析脚本

If you are loading the GA in different way. You can skip autoload of the GA script simply:
Do not enter your google analytics ID as parameter.

## Try our other React components
## Try our other React components 尝试其他反应成分

- Translate your great project [react-translate-maker](https://github.com/CherrySoftware/react-translate-maker)
- Forms [react-form-controlled](https://github.com/seeden/react-form-controlled)
Expand All @@ -155,6 +162,6 @@ Star this project on [GitHub][github-url].

## License

The MIT License (MIT)
the code is licensed at The MIT License (MIT)

Copyright (c) 2016 Zlatko Fedor [email protected]