react-native-dj-log

DJLog Native Plugin for React Native for both Android and iOS

Usage no npm install needed!

<script type="module">
  import reactNativeDjLog from 'https://cdn.skypack.dev/react-native-dj-log';
</script>

README

DJRNLog

Install

npm i --save react-native-dj-log

Usage

Using in your app will usually look like this:

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  TouchableHighlight,
} from 'react-native';

import djlog from 'react-native-dj-log';

djlog.init('8','100000000000987','ja9sffsd9fs0d9faf0asf','AppStore')

export default class NPMTest extends Component {
    render() {
      djlog.write('index-page-load',{'page':'index.ios.js'});
      return (
        <View style={{marginTop:20}}>
          <Switch open={true} onChange={this.onChange.bind(this)} />
        </View>
      );
    }
}

AppRegistry.registerComponent('xxx', () => NPMTest);

Props

The following props can be used to modify the style and/or behaviour:

Prop Type Opt/Required Default Note

Methods

The following methods can be used to open and close the Dialog:

Method Parameters Note
init appKey:应用id,userId:用户id,idfa:ios为idfa,安卓为uuid,channelId:ios默认为AppStore
write actionId:行为id,attrs:具体日志数据,为object

How to use (iOS):

建议在Native代码中初始化日志组件

Step 1. Install Dependencies

With CoacoaPods:
npm install --save react-native-dj-log

Then add this to your Podfile

pod 'DJLog', :svn => "http://svn.daojia-inc.com:8088/dianshangwuxian/trunk/mobile/jzt/ios/DJComponents/DJLog"
pod 'DJRNlog', :path => './node_modules/react-native-dj-log/src/ios'

Done

How to use (Android):

建议在Native代码中初始化日志组件

Step 1 - NPM Install

npm install --save react-native-dj-log

Step 2 - Update Gradle Settings

// file: android/settings.gradle
...

include ':react-native-dj-log'
project(':react-native-dj-log').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-dj-log/src/android')

Step 3 - Update app Gradle Build

// file: android/app/build.gradle
...

dependencies {
    ...
    compile 'com.daojia.lib:LogSDK:2.0.7'
    compile project(':react-native-dj-log')
}

Step 4 - Register React Package (this should work on React version but if it does not , try the ReactActivity based approach. Note: for version 3.0.0 and below you would have to pass in the instance of your Activity to the DJRNLogPackage constructor

...
import com.daojia.djrnlog.*;

public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {

    private ReactInstanceManager mReactInstanceManager;
    private ReactRootView mReactRootView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mReactRootView = new ReactRootView(this);
        mReactInstanceManager = ReactInstanceManager.builder()
                .setApplication(getApplication())
                .setBundleAssetName("index.android.bundle")  // this is dependant on how you name you JS files, example assumes index.android.js
                .setJSMainModuleName("index.android")        // this is dependant on how you name you JS files, example assumes index.android.js
                .addPackage(new MainReactPackage())
                .addPackage(new DJRNLogPackage())       // register DJRNLog module here
                .setUseDeveloperSupport(BuildConfig.DEBUG)
                .setInitialLifecycleState(LifecycleState.RESUMED)
                .build();
        mReactRootView.startReactApplication(mReactInstanceManager, "AwesomeProject", null); //change "AwesomeProject" to name of your app
        setContentView(mReactRootView);
    }
...

Alternative approach on newer versions of React Native (0.18+). Note: for version 3.0.0 and below you would have to pass in the instance of your Activity to the DJRNLogPackage constructor

import com.daojia.djrnlog.DJRNLogPackage;

public class MainApplication extends Application implements ReactApplication {
  ......

  /**
   * A list of packages used by the app. If the app uses additional views
   * or modules besides the default ones, add more packages here.
   */
    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
        new DJRNLogPackage(),   // register DJRNLogModule here
        new MainReactPackage());
    }
}