小编TJ *_*ems的帖子

浏览 vee-validates 文档，我没有看到任何用于验证选择输入的内容。所以我的问题是你能验证选择吗？目前我尝试的内容不会显示错误消息...

这是代码

<select id="category" v-model="client.category" name="Category Type" v-validate="'required'">
  <option disabled>{{option}}</option>
  <option v-for="category in categories" :key="category.id" :value="category">{{ category }}</option>
 </select>
 <spanv-show="errors.has('Category Type')">{{ errors.first('Category Type') }}</span>

所以我有一个正在渲染表单的组件，它还使用从 ajax 请求接收到的数据预先填充字段。

我的问题是，我不仅希望能够编辑字段，还希望同时添加要提交的新字段，因此我尝试将预填充的数据和新数据初始化到要提交的同一个对象中与我的ajax请求。根据我当前的设置，表单数据在呈现表单之前并没有始终如一地填充字段。

这是表单模板

<form @submit.prevent="editThisWorkflow" class="d-flex-column justify-content-center" >

 <div>
   <input type="text" v-model="workflowData.workflow">
    </div>
    <div >
    <div v-for="object in workflowData.statuses" :key="object.id">
    <input type="text" v-model="object.status">
    </div>
    <div v-for="(status, index) in workflowData.newStatuses" :key="index">
    <input type="text" placeholder="Add Status" v-model="status.value">
    <button type="button" @click="deleteField(index)">X</button>
    </div>
    <button type="button" @click="addField">
      New Status Field
    </button>
    </div>
    <div>
    <div>
    <button type="submit">Save</button>
    <router-link  :to="{ path: '/administrator/workflows'}" >Cancel</router-link>
  </div>
 </div>

</form>

这是脚本

data() {
        return {
            workflowData: {
                id: this.$store.state.workflow.id,
                workflow: this.$store.state.workflow.workflow,
                statuses: this.$store.state.workflow.statuses,
                newStatuses: []
            },
            workflowLoaded: false …

所以我之前问过一个问题，并在结果方面得到了一些帮助，logging但我的结果没有意义。

所以我有一个输入

<input type="file" name="import_file" v-on:change="selectedFile($event)">

将v-on:change所选文件绑定到我的数据对象this.file

selectedFile(event) {
      this.file = event.target.files[0]
    },

然后我用这种方法提交文件

uploadTodos() {
  let formData = new FormData();
  formData.append('file', this.file);
  for(var pair of formData.entries()) {
    console.log(pair[0]+ ', '+ pair[1]); 
   }
   this.$store.dispatch('uploadTodos', formData);
 }

但是，当我提交时，似乎没有附加任何数据，formData因为我的logged结果是这样的

file, [object File]

我不应该将实际数据附加到formData对象中吗？

我参考了有关如何发布的其他文章，但没有得到预期的结果。

第 1 条 第 2 条

uploadTodos(context, file) {
      console.log(file)
      axios.post('/import', file,{ headers: {
        'Content-Type': 'multipart/form-data'
      }})
      .then(response => {
        console.log(response.data)
        context.commit('importTodos', response.data)
      })
      .catch(error => { …

我正在尝试过滤一个包含嵌套对象数组的数组。我希望 v-for 只显示那些满足特定条件的对象。我已经创建了一个 JSfiddle点击这里

令我困惑的部分是每个 engagement 可能有 1 个对象或 3 个对象，而且我不知道如何检查每个嵌套对象的值条件。

我只想显示未回答的问题的 Engagements。我使用一个布尔值来表示问题是否得到回答。

这是 v-for

<div id="app">
  <h2>Engagements:</h2>
  <div>
    <div v-for="(engagment, index) in filteredQuestions" :key="index">
      <li v-for="question in engagment.questions" :key="question.id">
        <span>{{ question.id }},</span>
        <span> {{ question.question}} </span>
        <span><input type="checkbox" v-model="question.answered"></span>
      </li>
    </div>
  </div>
</div>

这是脚本和数据

new Vue({
  el: "#app",
  data: {
    engagements: [
      { 
        id: 1,
        text: "1040", 
        questions: [
            {
            id: 1,
            question: 'this is a question',
            answered: 0
          },
          {
            id: 2,
            question: 'this is a …

所以我试图按日期对对象数组进行排序，但我希望具有日期的对象优先于具有空日期的对象。

非排序数组示例：

[
  {due_date: null},
  {due_date: '03/11/2020'},
  {due_date: '02/10/2020'}
]

我希望数组在排序后按此顺序排列

[
  {due_date: '02/10/2020'},
  {due_date: '03/11/2020'},
  {due_date: null}
]

但是，当我通过脚本运行数组时

var firstSort = 'due_date'

return array.sort((a, b) => {
  return new Date(a[this.firstSort]) - new Date(b[this.firstSort])
})

我得到这个结果

[
  {due_date: null},
  {due_date: '02/10/2020'},
  {due_date: '03/11/2020'}
]

如何在排序时比较空日期或排除它？