1. @ice/stark-data
icestark-data is a JavaScript library for icestark, used for communication.
@ice/stark-data
Package: @ice/stark-data
Created by: ice-lab
Last modified: Tue, 04 Jul 2023 03:11:15 GMT
Version: 0.1.3
License: MIT
Downloads: 489
Repository: https://github.com/ice-lab/icestark

Install

npm install @ice/stark-data
yarn add @ice/stark-data

icestark-data

icestark sommunication solution. icestark docs.

NPM version Package Quality build status Test coverage NPM downloads David deps

Installation

 npm install @ice/stark-data --save

API

Store

Global Store, unified management of all variables

  • get(key)
  • set(key, value)
  • on(key, callback, force), when force is true, callback will be called immediately when initializing
  • off(key, callback)

example

 // Framework
import { store } from '@ice/stark-data';

const userInfo = { name: 'Tom', age: 18 };
store.set('user', userInfo); // set UserInfo
store.set('language', 'CH');

// Sub-application A
import { store } from '@ice/stark-data';

const userInfo = store.get('user'); // get UserInfo

function showLang(lang) {
  console.log(`current language is ${lang}`);
}

store.on('language', showLang, true); // add callback for 'language', callback will be called whenever 'language' is changed

store.off('language', showLang); // remove callback for 'language'

Event

Global Event, unified management of all events

  • on(key, callback) callback will be called with (...rest)
  • off(key, callback)
  • emit(key, ...rest)

example

 // Framework
import { event } from '@ice/stark-data';

function fresh(needFresh) {
  if (!needFresh) return;

  fetch('/api/fresh/message').then(res => {
    // ...
  });
}

event.on('freshMessage', fresh);

// Sub-application A
import { event } from '@ice/stark-data';

event.emit('freshMessage', false);
// ...
event.emit('freshMessage', true);

Contributors

Feel free to report any questions as an issue, we'd love to have your helping hand on icestark.

If you're interested in icestark, see CONTRIBUTING.md for more information to learn how to get started.

License

MIT

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin