PhizClip Docs

English

Português

English

Português

Appearance

React Native API ​

1. Initialize applet ​

Javascript
const eventEmitter = new NativeEventEmitter(NativeModules.FINMopSDK);
/**
 * @param {String} appkey
 * @param {String} secret
 * @param {String} apiServer
 * @param {String} apiPrefix
 * @param {Object} eventEmitter
 * @param {Object} finMopSDK(Native module references)
 **/
MopSDK.initialize({
	appkey:
		'Ev7QHvml1UcW98Y1GaLfRz34ReffbDESaTXbCoFyKhEm0a3gam0elOOOdZ6Twpa3HkBzlvOwJ2cyhOrMVWuuGw==',
	secret: '16f2d2700453ae51',
	apiServer: 'https://api.PhizClip.com',
	apiPrefix: '/api/v1/mop/',
	nativeEventEmitter: eventEmitter,
	finMopSDK: NativeModules.FINMopSDK,
})
.then(res => {
	isInited = true;
	Alert.alert('Initialization successful');
})
.catch(error => {
	Alert.alert('Initialization failure');
});

2. Get information about the applet currently in use ​

Javascript
MopSDK.currentApplet().then(res => {
	console.log('currentApplet', res);
});

3. Close the applet ​

Javascript
/**
 * @param {String} appId
 * @param {Boolean} animated Close with or without animation
 **/
MopSDK.closeApplet('xxxxx', true);

4. Close all currently open applets ​

Javascript
MopSDK.closeAllApplets();

5. Dimension code to open the small program ​

Javascript
/**
 * @param {String} qrcode
 **/
MopSDK.qrcodeOpenApplet(qrcode)

6. Clear cache applet ​

Javascript
MopSDK.clearApplets();

7. Register applet event handling ​

Javascript
const handler = {
	forwardApplet(params) {
		// Forwarding applet
		return [];
	},
	getUserInfo(params) {
		// Obtain user information
		return {
			name: 'jimmy',
			nickName: 'jimmy chung',
			avatarUrl: 'http://xxx.jpg',
		};
	},
	getCustomMenus(params) {
		// Click on the menu
		let list = [
			{
				menuId: 'menuid1',
				image: 'image',
				title: 'title',
				type: 'type',
				foo: 'foo',
			},
			{
				menuId: 'menuid2',
				image: 'image',
				title: 'title',
				type: 'type',
				foo: 'foo',
			},
		];
		return list;
	},
	onCustomMenuClick(params) {
		// Click on the custom menu
		console.log('onCustomMenuClick', params);
	},
	appletDidOpen(params) {
		// After opening the applet (iOS only)
		console.log('appletDidOpen', params);
		return params;
	},
};
/**
 * @param {Object} handler Contains several of the above event handling functions
 **/
MopSDK.registerAppletHandler(handler);

8. Registering the webview extension API ​

Javascript
const rnWebCustomAPI = params => {
	console.warn('webview Customization api rnWebCustomAPI call', params);
	return {
		errMsg: 'rnWebCustomAPI:ok',
		data: '100',
	};
};
/**
 * @params {String} WEBVIEW Custom API Name
 * @params {Function} WEBVIEW Custom API implementation
 **/
MopSDK.addWebExtentionApi('rnWebCustomAPI', rnWebCustomAPI);

// webview
JSSDK.callNativeAPI('rnWebCustomAPI', {
	bar: 1
})

9. Register for Extended API ​

Javascript
const rnCustomAPI = params => {
	console.warn('Customization api rn rnCustomAPI call', params);
	return {
		errMsg: 'rnCustomAPI:ok',
		data: '100',
	};
};
/**
 * @params {String} Custom API Name
 * @params {Function} Custom API implementation
 **/
MopSDK.registerExtensionApi('rnCustomAPI', rnCustomAPI);

10. Native calls to js methods in webview ​

Javascript
/**
 * @param {String} appId
 * @param {String} Name of the function provided by webview
 * @param {Object} Called parameters
 **/
MopSDK.callJS(appId, 'app2jsFunction', {
	data: 100,
})
.then(res => {
	console.warn('calljs Successful call');
})
.catch(res => {
	console.warn('calljs Call failure');
});

// webview
JSSDK.registNativeAPIHandler('app2jsFunction', funtion(res){
	console.log('The result of the call is', res)
})

11. Send events to applets natively ​

Javascript
/**
 * @param {String} appId
 * @param {Object} data
 **/
MopSDK.sendCustomEvent(appId, {
	evenatName: 'hello-world',
	foo: 'test',
});

12. End the applet ​

Javascript
/**
 * @param {String} appId
 * @param {Boolean} animated Whether animation
 **/
MopSDK.finishRunningApplet(appId, true);

13. Set applet switching animation (Android only) ​

Javascript
/**
 * @param {String} anim
 * SlideFromLeftToRightAnim
 * SlideFromRightToLeftAnim,
 * SlideFromTopToBottomAnim,
 * SlideFromBottomToTopAnim,
 * FadeInAnim,
 * NoneAnim
 **/
MopSDK.setActivityTransitionAnim(anim) {