-
Notifications
You must be signed in to change notification settings - Fork 45
Use with Vuex #41
Comments
the manager page uses vuex but the preview(iframe) does not, your component does not really affect vue-play, it's independent from the app interface. ./src/preview.js is the actual file loading your component. |
Currently you can import your vuex // ./play/index.js
import {play} from 'vue-play'
import MyButton from './components/MyButton.vue'
import store from './store'
play('Button', module)
.add('with text', h => h(MyButton, {on: {click: () => store.commit('HELLO')}}, 'hello')) |
That was my question really, whether it's possible to bind the store to the Vue instance since I want to be able to use |
Maybe It could be done with |
@egoist Thanks for the suggestion. I'm new to Vue so I'm still figuring out how all this stuff works :) I'll update if I come up with anything useful. |
Hey, I was thinking about it, and for me it seems that the most natural implementation would be to be able to initialize vuex for each scenario like this: play('some component', module)
.add('state with accessGranted', {
store: {
state: {
accessGranted: true,
},
},
render: (h) => {
return h(syncStart);
},
}); I think we would only need to add support for Vuex in https://github.com/vue-play/vue-play/blob/master/src/preview.js - can prepare a PR Currently I'm just mocking relevant data stores and vuex for each component like so: play('Prepare commit message', module)
.add('default view', {
store: {
state: {
repo: 'org/reponame',
filePath: 'filename.yaml',
branch: 'master',
repolist,
user: { avatar: 'https://avatars.githubusercontent.com/u/0?v=3' },
},
getters: {
accounts: uniqBy(repolist.map(_ => _.owner), 'login'),
},
commit(action, data) {
if (action === 'setAccount') {
this.state.selectedAccount = data;
}
},
dispatch() {
return new Promise((resolve) => {
setTimeout(() => resolve(), 2000);
});
},
},
render: (h) => {
return h(syncStart);
},
}); |
@JackuB looks good |
@JackuB Looks good to me too. Would love to see this integrated :) |
How can I inject a Vuex store for use with components I'm testing? I see vue-play itself uses Vuex so I'm not sure how to make use of Vuex myself without vue-play interfering.
The text was updated successfully, but these errors were encountered: