Vuex access data property - vue.js

I am using vue-offline but I can't use it in store to check online status.
In components I can access as:
if (this.isOnline)
or in template with
v-if="isOnline"
In store (module) I tried:
if (this._vm.$isOnline)
but it returns always false.
How do I access it in vuex?

You can pass the online status as an argument from your component...
or you can easily check the online status using navigator.onLine (used by vue-offline, see the file).
So it will be in your store:
if (navigator.onLine)
Here is an example showing the online status in the console using both methods:
https://codesandbox.io/s/vuex-store-9zhy3

Related

How can i manage a global variable among different webpages in wix?

I am developing a site for online test series. I receive details o student on one page and wish to display the info on net page as dashboard. I need a global variables that can hold the detail of student like his roll no, name, email, class, semester, subject and the test he wishes to solve.
I have tries using a separate .js file to hold variables. However, the values of variables get lost as i move to next page.
can anyone help?
The code and links are attached.
https://ishuuw.wixsite.com/ymatutor/test-series
//import wixData from 'wix-data';
import {globalVars} from 'public/vars.js';
$w.onReady(function () {
});
export function button2_click(onClick,button2){
globalVars.StudentRoll=$w('#input1').value
globalVars.StudentName=$w('#input5').value
globalVars.StudentSurname=$w('#input6').value
globalVars.StudentMail=$w('#input7').value
globalVars.StudentClass=$w('#dropdown1').value
globalVars.StudentYear=$w('#dropdown2').value
globalVars.StudentSemester=$w('#dropdown3').value
globalVars.StudentPaper=$w('#dropdown5').value
globalVars.StudentTest=$w('#dropdown6').value
//Just to test, this works well
$w('#text63').text=globalVars.StudentRoll
$w('#text64').text=globalVars.StudentName
$w('#text65').text=globalVars.StudentSurname
$w('#text66').text=globalVars.StudentMail
$w('#text67').text=globalVars.StudentClass
$w('#text68').text=globalVars.StudentYear
$w('#text69').text=globalVars.StudentSemester
$w('#text70').text=globalVars.StudentPaper
$w('#text71').text=globalVars.StudentTest
}
`
Sounds like you should be using wix-storage. That will allow you to pass information between pages.
Use local storage if you want the data to persist for the user even after the user ends the session. Meaning, next session, the user's data will still be available.
Use session storage if you want the data to be removed when the user's session ends.

Accessing Vue Store values in Router

I need to access a variable from my store in my router. This variable is called 'isAdmin'. Now, when I'm using the following code, I'm getting the initial state (which has the value of 'false'):
console.log(store.state.isAdmin)
Although I've updated the 'isAdmin' value to 'true' committing an action, the state of 'isAdmin' continues to be as the initial state.
Now, if I console.log the following object:
console.log(store.state)
I see this:
My question is: How do I get to the value of isAdmin after I've amended it in my store?
Thank you!!!

use google tag manager custom HTML tag to populate data on pages

I have a question about gtm.
so currently I have created a script that can create all the data I need into datalayer this is how the data layer looks like (from page source code):
<script>
dataLayer = [{"visitorLoginState":"Logged out","visitorType":"NOT LOGGED IN","visitorLifetimeValue":0,"visitorExistingCustomer":"No"}];
</script>
but all this is generated from my store, but they key would be to be able to use these variables through GTM.
so inside GTM UI i created a custom html tag and added:
<script>
dataLayer.push({'event': 'visitorLoginState'});
</script>
I also created a custom macro->data layer variable with the name of "visitorLoginState" hoping that it would show "NO" instead of visitorLoginState in the response. but it just showing "visitorLoginState"
I am new to GTM too and getting to grips with it all.
From what I can see it looks like you are using macros and the dataLayer incorrectly.
You are running a script to add another row called event to the datalayer whilst already declaring what you want in the data layer. So initially the output in the source would be along the lines of:
visitorLoginState: Logged Out
visitortype: Not Logged In
ETC...
With the script you have added in GTM it would go to:
visitorLoginState: Logged Out
visitortype: Not Logged In
event: visitorLoginState
ETC
What you want to do is actually create a macro called visitorLoginState with the Type of Data Layer Variable, using the Data Layer Variable Name of visitorLoginState (and so forth).
From there you can create a Rule in GTM which will activate something based on what is returned in the data layer.
So your Rule could be:
visitorLoginState equals Logged out.
You could then have your script in the tags part of GTM which would say something like:
<script>
dataLayer.push({'event': 'No'});
</script>

Passing variables into JavaScript in ExpressJS/PassportJS/Jade app

This is essentially a continuation of the question here: Nodejs Passport display username.
app.get('/hello', function(req, res) {
res.render('index.jade', { name: req.user.username });
});
So users log in via PassportJS, and goes to index.jade, which contains #{name} in the body, which will be replaced by the value of req.user.username.
Question: Is it possible to use the value of req.user.username in index.jade's JavaScript? I tried assigning its value to a variable but it doesn't work.
I have been using the trick of having a hidden input with #{name} as value:
input(type='hidden', id='variableName', value='#{name}')
Then JavaScript can access this value using:
$("#variableName").val()
This works. But does it have any potential downside like security issues? What is the right way to do this?
You have a few options. One of them is what you did and put the value inside you html. You can also solve it by doing:
script
window.name = #{name};
This will create an inline script that sets the variable. The other option you have is using ajax. That means you probably need to make an extra route to reply to that request.

Sencha Touch Issue with Stores

I have a store defined that I want to manually add data to. The store is connected to a model with the proper fields defined and the store is instantiated.
Why does this work
Ext.getStore('Inspections').add({"code":"123","descr":"Inspection 123"});
Why does this not work
Ext.getStore('Inspections').loadData([{"code":"123","descr":"Inspection 123"}]);
I get LoadData not defined error.
Because loadData is not a method on Store: http://docs.sencha.com/touch/2-0/#!/api/Ext.data.Store
What you want is setData.