-
-
Save tiagoeborsanyi/9a12ed29f497cbb16bca1f19f347242c to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Esse é o arquivo store.js | |
import Vue from 'vue' | |
import Vuex from 'vuex' | |
//Indica para o Vue utilizar o vuex | |
Vue.use(Vuex) | |
//cria variaveis de estado para todos os componentes filhos terem acesso | |
const state = { | |
info: [] | |
} | |
//Cria objetos para armazenar todas as mutações das variaveis state | |
const mutations = { | |
INCREMENTINFO (state, valor) { | |
console.log(valor) | |
} | |
} | |
/* | |
Combina o estado inicial com as mutações para criar um armazém | |
esse armazém é vinculado ao aplucativo (componente pai) | |
*/ | |
export default new Vuex.Store({ | |
state, | |
mutations | |
}) | |
Arquivo actions.js | |
export const incrementInfo = function ({dispatch}, e) { | |
dispatch('INCREMENTINFO', e) | |
} | |
O component que chamando a funcção de actions pra poder ser executada quando é clicada: | |
<script> | |
import { incrementInfo } from '../../vuex/actions' | |
console.log(incrementInfo) //retorna uma function | |
export default { | |
props: { | |
item: Object | |
}, | |
vuex: { | |
actions: { | |
incrementInfo | |
} | |
} | |
} | |
</script> | |
<template> | |
<div class="row"> | |
<a v-link="{path: '/create/', name: '/' }"><span @click="incrementInfo('texas')" class="glyphicon glyphicon-map-marker margem-marker" aria-hidden="true"></span></a> | |
<span>{{item.adress}} </span> | |
<span class="glyphicon glyphicon-trash margem-trash" aria-hidden="true"></span> | |
</div> | |
</template> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment