Vue.js计算值永远不会在启动时运行

时间:2017-05-01 01:43:14

标签: javascript vue.js

我的计算值get函数永远不会在创建vm时运行,因此它应该具有的值永远不会被赋值。

奇怪的是,如果我尝试访问该值,它就会运行,只是在应用程序启动时才会运行。

基本上我应该计算皮肤的值并在启动时或更改后应更改样式表链接以加载正确的皮肤。

效果很好,问题是它不是在启动时运行的。我是否必须使用一些hacky解决方案,例如,在vm的挂载函数中获取值一次?或者我在这里错过了一些东西......

    computed: {
        skin: {
            get: function () {
                var mySkin = "my/skin/string";
                if (window.localStorage.getItem("skin") === null) {
                    window.localStorage.setItem("skin", mySkin);
                    jquery("link[id='skin']").attr("href", "css/skins/" + mySkin + ".css");
                } else {
                    mySkin = window.localStorage.getItem("skin");
                    window.localStorage.setItem("skin", mySkin);
                    jquery("link[id='skin']").attr("href", "css/skins/" + mySkin + ".css");
                }
                var hey = this.skin;
                return mySkin;
            },
            set: function (val) {
                window.localStorage.setItem("skin", val);
                jquery("link[id='skin']").attr("href", "css/skins/" + val + ".css");
            }
        }
    }

1 个答案:

答案 0 :(得分:0)

Computed属性是一个依赖于数据属性的属性。

在您的情况下,最好是IMO创建data属性skin,以及像setSkin()这样初始化skin数据属性的方法,以及另一种方法{{ 1}}将您的属性保存到localStorage。

然后,您可以在saveSkin()挂钩中运行setSkin()

模板:

mounted()