Mají variabilní změny na tlačítko klepněte na tlačítko, ale zpočátku nastavit pomocí localStorage v vue

0

Otázka

Snažím se nastavit tlačítko, které změní hodnotu data v Vue, ale také si to nastavit pomocí localStorage initally. Tento způsob, jak mohu to udržet předchozího stavu, který byl předtím aktualizovat stránku. Níže je kód, používám a jsem schopen se dostat do práce, ale vím, že by bylo vhodnější použít vypočítaný bod, ale nebyl schopen se dostat, že pracovat správně.

Chtěl by někdo vědět, co se děje špatně?

Moje tlačítko je spuštěna pomocí zkušební metody a proměnné v otázce je isGrid.

export default {
    data() {
        return {
            option: 'default',
        }
    },
    components: {
        FileUploader,
    },
    mixins: [
        visibilitiesMixin,
        settingsMixin
    ],
    props: {
        vehicleId: {
            type: Number,
            required: true,
            default: null,
        }
    },
    computed: {
        ...mapState([
            'isLoading',
            'images',
            'fallbackImageChecks',
            'selectedImages'
        ]),
        isGrid: {
            get() {
                return localStorage.getItem('isGrid');
            },
        },
        imagesVModel: {
            get() {
                return this.images;
            },
            set(images) {
                this.setImages(images);
            }
        },
        selectedImagesVModel: {
            get() {
                return this.selectedImages;
            },
            set(images) {
                this.setSelectedImages(images);
            }
        },
        removeBgEnabled() {
            return this.setting('nexus_integration_removebg_enabled') === 'enabled';
        },
    },
    mounted() {
        this.loadImages(this.vehicleId);
    },
    methods: {
        testing() {
            if (this.isGrid === 'false' || this.isGrid === false) {
                localStorage.setItem('isGrid', true);
                this.isGrid = true;
                console.log(this.isGrid);
                console.log(localStorage.getItem('isGrid'));
            } else {
                localStorage.setItem('isGrid', false);
                this.isGrid = false;
                console.log('b');
                console.log(this.isGrid);
                console.log(localStorage.getItem('isGrid'));
            }
        },
   }
html javascript nuxt.js vue.js
2021-11-24 06:14:17
1

Nejlepší odpověď

1

Doporučuji vám použít vuex s vuex-persistedstate.

https://www.npmjs.com/package/vuex-persistedstate

2021-11-24 06:23:20

Jsem schopen používat persistedstate bohužel. Existuje nějaká alternativa k dostat tuto práci s počítačovou?
Arshavin123

V jiných jazycích

Tato stránka je v jiných jazycích

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................