Closed Derasm closed 3 years ago
Hey,
Sorry for the late reply. The docs could really do with some improvement; they are too wordy and is mainly Guide with no API reference, so sorry you had to chase down wild geese.
To answer your questions as best I can:
Call and Sync (capitalised)
Anything capitalised will be the TS class decorator equivalents of the JS helper functions for using Class Components. This bit was actually from a contributor, so sorry if that wasn't documented fully. I'll take a look at some point (won't be soon).
Likewise, the "Paths are Mapped to store members via a configurable naming scheme part on Pathify 101 would be easily improved if it included an example of each of the 4 types of actions that can be done:
The naming scheme is actually this bit:
As for examples, this is covered by the 101 and the demos:
You make various other points which I'll not get into now because you're right, the docs need improving.
When I wrote them, I thought they were great, but having been away from them myself for a while, I can see how for someone missing a couple of prerequisites, or had some mistaken assumptions, they could be hard to understand.
If you have the time and inclination, they are best read from start to finish using the "next" arrows at the bottom of each page.
The problem with Pathify is it's simple to use (could probably document it in a couple of pages) but lots going on to make it simple, which I wanted to try and explain... but it gets very verbose.
Unfortunately I have very little time for OSS these days, so I just never get time to update them.
Have a little scan of the demos and everything should become clearer (I hope!):
Make sure you click the big green buttons in the browser to load the code in the left pane. All should become clear.
question: can you use the typical get/set in the store itself?
There are 2 main ways to use Pathify:
get
and sync
which basically replace the Vuex mapBlah
functionsthis.$store.set('foo/bar', 123)
Generally you won't need to use the methods on the store so much if you're using get and sync.
Any more questions, feel free to ask.
Also, FYI a job I was working on this morning, with get
, sync
and call
:
<template>
<el-container>
<el-aside>
</el-aside>
<el-main>
<h1>{{ $options.head.title }}</h1>
<el-form @submit.native.prevent="search">
<el-input v-model="query" placeholder="Please input" class="input-with-select">
<el-button slot="append" icon="el-icon-search" @click="search"></el-button>
</el-input>
</el-form>
<section v-if="loading">
Loading
</section>
<section v-else class="news__articles">
<article v-for="result in results" :key="result.acc" class="article">
<h3 class="news__articleTitle">{{ result.title }}</h3>
<ul class="news__articleStats">
<li>{{ result.publishedAt }}</li>
<li>{{ result.words }} words</li>
<li>{{ result.source.name }}</li>
</ul>
<p>{{ result.description }}</p>
</article>
</section>
</el-main>
</el-container>
</template>
<script>
import { sync, call } from 'vuex-pathify'
import page from './page'
export default {
extends: page('News Search'),
computed: sync('news', [
'query',
'loading',
'results',
]),
methods: {
search: call('news/search'),
}
}
</script>
LMK if any questions.
Hey Dave, no probs with the late reply. Is there a way to help with the docs? Some kind of "improve this" option for them if they are hosted in Github or similar?
Also updated question: Getters with parameters. In practically any other situation i'd say
this.$store.get("GetSomeMethod", somedata)
would be equivalent to a getter like so: function(state, somedata)
However all i could find was the possibility for sending state and getters, but no dynamic data - which makes using said data in the getter pretty hard. Is this something that is doable, or should i make use of Actions for this instead?
Hi Dennis.
Re: docs, sure, you can submit a pull request!
Re: getters, not 100% sure I understand what you're asking.
Here is an example of using a getter with parameters:
Note the format of the store getter, which is a function that returns a function (as described in the Vuex docs):
salutation: (state) => (name) => {
return `${state.greeting} ${name} !`;
}
Is that what you need?
s it is right now, the the Call() function and Sync() is not explained in 101 page - the rest of them are. This makes it quite difficult to reference how it should be used, and makes it into a wild goosechase to find in the docs.
Example:
Likewise, the "Paths are Mapped to store members via a configurable naming scheme part on Pathify 101 would be easily improved if it included an example of each of the 4 types of actions that can be done: note: preface to these should be
this.$store
, but for brevity we'll write store.get here.if these are called within the store itself, it functions the same with commit and payload respectively.
question: can you use the typical get/set in the store itself?