vuex中vuejs绑定_Vuex中的VueJs Flash消息组件

vuex中vuejs绑定

Vuex Flash (Vuex Flash)

Flash message component for Vue.js within Vuex.

Vuex中Vue.js的Flash消息组件。

View demo 查看演示 Download Source 下载源

//... someMethod(){ //.. this.$store.commit('FLASH/SET_FLASH', { message: 'some message', variant: 'success' }); } }

// ... someMethod(){// .. this。$ store.commit('FLASH / SET_FLASH'，{message：'some message'，variant：'success'}); }}

In **`mapMutations`** way:

```javascript

methods: {
  //...
  someMethod(){
    //..
    this.flash({ message: 'some message', variant: 'success' });
  },

  ...mapMutations({
    flash: 'FLASH/SET_FLASH'
  })
}

Note that the default mutation type is FLASH/SET_FLASH. You can configure it in options.

请注意，默认突变类型为FLASH/SET_FLASH 。 您可以在options中配置它。

显示闪光灯 (Display flash)

//in somepage component

<template>
  <flash-message variant="success"></flash-message>
  //......
</template>

多重闪光 (Multiple flash)

this.flash({ message: 'some success message', variant: 'success' });
this.flash({ message: 'some warning message', variant: 'warning' });
this.flash({ message: 'some danger message', variant: 'danger' });
this.$router.push('/somepage'); //redirect to /somepage

//in somepage
<flash-message variant="success"></flash-message>
<flash-message variant="danger"></flash-message>
<flash-message variant="warning"></flash-message>

翻译自: https://vuejsexamples.com/vuejs-flash-message-component-within-vuex/

vuex中vuejs绑定