我有一个带有表单验证的组件。这是一个多步骤结帐表单。下面的代码是第一步。我想验证用户是否输入了一些文本,将其名称存储在全局状态,然后发送到下一步。我正在使用vee验证和vuex
html prettyprint-override"><template>
<div>
<div class='field'>
<label class='label' for='name'>Name</label>
<div class="control has-icons-right">
<input name="name" v-model="name" v-validate="'required|alpha'" :class="{'input': true, 'is-danger': errors.has('name') }" type="text" placeholder="First and Last">
<span class="icon is-small is-right" v-if="errors.has('name')">
<i class="fa fa-warning"></i>
</span>
</div>
<p class="help is-danger" v-show="errors.has('name')">{{ errors.first('name') }}</p>
</div>
<div class="field pull-right">
<button class="button is-medium is-primary" type="submit" @click.prevent="nextStep">Next Step</button>
</div>
</div>
</template>
<script>
export default {
methods: {
nextStep(){
var self = this;
// from baianat/vee-validate
this.$validator.validateAll().then((result) => {
if (result) {
this.$store.dispatch('addContactInfoForOrder', self);
this.$store.dispatch('goToNextStep');
return;
}
});
}
},
computed: {
name: function(){
return this.$store.state.name;
}
}
}
</script>
我有一个处理订单状态和记录名称的商店。最终,我想把所有的信息从多步表单发送到服务器。
export default {
state: {
name: '',
},
mutations: {
UPDATE_ORDER_CONTACT(state, payload){
state.name = payload.name;
}
},
actions: {
addContactInfoForOrder({commit}, payload) {
commit('UPDATE_ORDER_CONTACT', payload);
}
}
}
当我运行这段代码时,我得到一个错误,Computed属性“name”被分配给了它,但它没有setter
如何将名称字段中的值绑定到全局状态?我希望这是持久的,这样即使用户返回一个步骤(在单击“下一步”之后),他们也会看到他们在此步骤中输入的名称
对我来说,它正在改变。
this.name = response.data;
计算的回报如此;
this.$store.state.name = response.data;
应该是这样的。
在您的组件中
computed: {
...mapGetters({
nameFromStore: 'name'
}),
name: {
get(){
return this.nameFromStore
},
set(newName){
return newName
}
}
}
在你的店里
export const store = new Vuex.Store({
state:{
name : "Stackoverflow"
},
getters: {
name: (state) => {
return state.name;
}
}
}
如果您要v-model
a computed,它需要一个setter。无论您希望它对更新后的值做什么(考虑到getter就是从中提取它的,可能将其写入$store
),您都可以在setter中执行。
如果通过表单提交将其写回存储,您不想v-model
,只想设置:value
。
如果希望具有中间状态,即它保存在某个位置,但在提交表单之前不会覆盖$store
中的源,则需要创建这样的数据项。
问题内容: 我是Swift的新手,只是在文档中遇到了这一点: 计算的属性由类,结构和枚举提供。存储的属性仅由类和结构提供。 这是为什么?枚举的关联值是否像存储属性一样工作?似乎他们最初存储了属性- 问题答案: 确实具有存储的 类型 属性-即属性。他们没有存储的 实例 属性。我不知道是否存在技术上的原因为什么存储的实例属性不可用于。如果您想要“为什么”的技术答案,则可能需要在开发论坛上提问。 在您的
我试图在AWS EC2实例上运行我的java Web应用程序。我得到的错误是 通过查看其他问题,我发现问题可能与MANIFEST.mf文件有关。我把那个文件放在META-INF文件夹下,但是它缺少主类标记。 我使用servlet之类的东西开发了Java web应用程序,但我没有使用SpringBoot,我不确定我的程序的起点是什么。 以下是我的pom.xml的一部分: 我原以为maven jar插
说明: string Worker::$name 设置当前Worker实例的名称,方便运行status命令时识别进程。不设置时默认为none。 范例 use WorkermanWorker; require_once __DIR__ . '/Workerman/Autoloader.php'; $worker = new Worker('websocket://0.0.0.0:8484'); //
全部显示 返回或设置指定对象的名称。对于CommandBar 对象,String 类型,可读写;对于其他所有对象,String 类型,只读。 说明 内置命令栏的本地名称显示在标题栏中(在命令栏未固定时)以及有效命令栏列表中(无论该列表显示在容器应用程序的哪个位置)。 对内置命令栏,Name 属性返回该命令栏的美式英语名称。用NameLocal 属性可返回其本地化的名称。 如果改变了一个自定义命令栏
这里有点糊涂。环顾四周,什么也没发现。很多人似乎有类似的问题,但我还没有看到一个解决方案。 我从这里克隆了IntelliJ gradle非调制器hellofx示例应用程序。 构建和运行良好,很好。 但是Main-Class属性在构建工件时生成的清单文件中:
主要内容:实例 1,实例 2,computed vs methods,实例 3,computed setter,实例 4计算属性关键词: computed。 计算属性在处理一些复杂逻辑时是很有用的。 可以看下以下反转字符串的例子: 实例 1 <div id="app"> {{ message.split('').reverse().join('') }} </div> 实例 1 中模板变的很复杂起来,也不容易看懂理解。 接下来我们看看使用了计算属性的实例: 实例 2 <div id="app">