Problem recreating example from docs
See original GitHub issueHello,
First of all thank you for this great helper tool. I’m having troubles using it (see below), but looks just like what my project needs. I hope a noob question is okay:
When I try recreating the example code from the docs, vue devtools show me a state with empty objects (e.g. posts: Array[0]
, ``pending: … post: false … ).
I’ve set up a new Vue project using vue-cli 3, installed vuex-rest-api 2.8 and axios 0.18.
My store.js
import Vuex from "vuex"
import Vue from "vue"
// Step 1
import Vapi from "vuex-rest-api"
Vue.use(Vuex)
// Step 2
const posts = new Vapi({
baseURL: "https://jsonplaceholder.typicode.com",
state: {
posts: []
}
})
// Step 3
.get({
action: "getPost",
property: "post",
path: ({ id }) => `/posts/${id}`
})
.get({
action: "listPosts",
property: "posts",
path: "/posts"
})
.post({
action: "updatePost",
property: "post",
path: ({ id }) => `/posts/${id}`
})
// Step 4
.getStore()
// Step 5
export const store = new Vuex.Store(posts)
the <script> section of my Home.vue where I’d like to display the test data:
<script>
import store from "../store"
import {mapState, mapActions} from 'vuex'
export default {
name: 'home',
computed: mapState([
'posts'
]),
created() {
this.listPosts()
},
vuex: {
getters: {
}
},
methods:{
}
}
</script>
Could anyone point out the error(s) in my setup? I’m new to Vuex and would love an easy access to our REST API using this tool.
Thank you in advance!
Issue Analytics
- State:
- Created 5 years ago
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Recreating the problem - IBM
Recreate the problem to isolate its cause to a specific sequence of events, if the problem can be easily or consistently recreated.
Read more >How to Mass Remove Paragraph Breaks in Google Docs
Chapters. View all · Introduction · Introduction · Introduction · Recreating the Paragraph Break Problem · Recreating the Paragraph Break Problem.
Read more >A way to cause resources to be deleted and recreated #5882
What I expected it to do is to remove resource first and then create it again, completely skipping Kubernetes Spec validation issues. Edit....
Read more >Troubleshooting cluster creation and upgrade - Anthos
Troubleshooting cluster creation and upgrade. Anthos clusters on VMware. Google Cloud.
Read more >Resync or repair Outlook data - Google Workspace Learning ...
For more information on Outlook search issues, consult this Microsoft article. ... updating just the data type you selected (for example, Google Contacts, ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Thanks once again, makes sense. I took out the store reference from Home.vue, my app.js (created automatically by vue cli) should work
There’s still something wrong, but just shows me that I need to study the vuex docs more carefully. Thank you again for pointing all this out 👍
Wow, thanks for that lightning quick response 👍
So I guess it was a noob question and not my usage of vapi. Mapping the actions didn’t do the trick (yet), but I’ll investigate some more. Thanks again!