twitchext-vue v0.0.3
Twitch-Ext-Vue
An abstraction of the Twitch Extension helper for Vue applications
Description
This lib allows you to abstract the Twitch extension helper for your twitch extension project using Vue.
You can easily have a reactive Twitch extension without worrying about all the set up.
Dependencies
- Vue
How to use
Use the plugin
This lib will add a $ext field to your Vue instance where you can access all of the Twitch extension helper but with reactive values.
You need to create the store before using it in the plugin.
import Vue from "vue";
import App from "./App";
import TwitchExtPlugin from "twitchext-vue";
Vue.use(TwitchExtPlugin);
new Vue({
el: "#app",
render: h => h(App)
});You will be able to to access the data as computed values
computed(){
...
opaqueId(){
return this.$ext.viewer.id
}
}Plugin structure description
General data
The data structure is based on the - Twitch Extension Helper
You can access the data using the same structure
...
computed:{
...
opaqueId(){
return this.$ext.viewer.id
}
}Custom data
bits
bits.hasOngoingBitTransaction:boolean return if the user has a bits transaction going on.
Channel
channel.initialized:boolean return if the channel information have been set.
id:string return the channel id of the stream.
Configuration Service
configuration.initialized:boolean return if the configuration service has been set.
Position
position.initialized:boolean return if the position information have been set.
Viewer
viewer.initialized:boolean return if the viewer information have been set.
Context
For the default data structure see the OnContext method.
The same structure is used to store the data under the context field.
context.initialized:boolean return if the context information have been set.
Query Params
For the default data structure see the Query Params doc.
Use this.$ext.queryParams to access the values.
Other frameworks
React
You can use my other package for React : TwitchExt-React