Access app.data


#1

Hello folks,

Javascript isn’t really my forte but I’m moving forward, but I wanted to share some stuff in the app.data object . What moronic thing am I doing wrong? :slight_smile:

var app = new Framework7({
    id: 'myapp',
    root: '#app',
    theme: theme,
    routes: [
        {
            path: '/main/',
            url: './pages/main.html',
            name: 'home',
        },
        {
            path: '/',
            url: './splash.html',
            name: 'splash',
        }
    ],
    uid: i,
    data:function(){
        return this.theme;
    }
});

console.log(app.data())

In a nutshell, why does app.data() throw an error. What am I supposed to call?


#2

console.log(app.data)


#3

thats what I did the first time around, it just says “undefined”


#4

app data MUST return an object on initiliazation. To access app data you must access just a app.data without a function call:

...
data() {
  return {
    theme: this.theme,
  };
},

And to access it app.data.theme


#5
var app = new Framework7({
    id: 'faboroto.linkmyfilm',
    root: '#app',
    theme: theme,
    routes: [
        {
            path: '/main/',
            url: './pages/main.html',
            name: 'home',
        },
        {
            path: '/',
            url: './splash.html',
            name: 'splash',

        },
        {
          path: '/menu',
          url: './pages/menu.html',
          name: 'menu'
        }
    ],
    uid: i,
    data() {
        theme: this.theme
     }
});



console.log(app.data.theme)



Uncaught TypeError: Cannot read property 'theme' of undefined

#6

I think you should return an object { theme: this.theme }. In your code, the return word is missing.


#7

I give up, isn’t there an example somewhere I can try? :slight_smile:


#8

simply copy and paste the code that Vladimir posted above. Your last code is not the same as what he suggested.


#9
var app = new Framework7({
    id: 'myapp',
    root: '#app',
    theme: theme,
    routes: [
        {
            path: '/main/',
            url: './pages/main.html',
            name: 'home',
        },
        {
            path: '/',
            url: './splash.html',
            name: 'splash',

        },
        {
          path: '/menu',
          url: './pages/menu.html',
          name: 'menu'
        }
    ],
    uid: i,
    data() {
      return {
        theme: this.theme
     }
   }
});

console.log(app.data.theme)

which results in

Uncaught TypeError: Cannot read property 'theme' of undefined

Which is the same as this mornings effort.


#10

Hi @buggtb,

You need declare theme variable like below.

var theme=‘auto’; //dynamic based on device OS
or
var theme=‘md’; //Material theme
or
var theme=‘ios’; //ios theme


#11

https://jsfiddle.net/nolimits4web/rdphx056/