如何在vue js中用逗号分隔的字符串中发布子类别？

Posted 2023-02-23

【中文标题】如何在vue js中用逗号分隔的字符串中发布子类别？

【英文标题】：How to post subcategory inside string seperated by commas in vue js?

【发布时间】：2018-06-03 05:58:40

【问题描述】：

现在我可以通过以下方式发布子类别了吗？ 现在结果是

subcategory[] : Healthcare
subcategory[] : education

但我需要将其作为用逗号分隔的字符串吗？

我的html代码是

<div id="submitBox">
  <form method="POST" onSubmit="return false;" data-parsley-validate="true" v-on:submit="handelSubmit($event);">
    <select id="basic" class="selectpicker"  data-live-search="true" data-live-search-style="begins" title="Select Your City" v-model="subcategory" name="subcategory[]" multiple>
      <option v-for="so in services" v-bind:value="so.name">so.name</option>  
   </form>
</div>

我的vue js代码是

<script>
submitBox = new Vue(
  el: "#submitBox",
  data: 
    subcategory: [],
  ,
  methods: 
    handelSubmit: function(e) 
      var vm = this;
      data = ;
      data['subcategory'] = this.subcategory;
      $.ajax(
        url: '/post/',
        data: data,
        type: "POST",
        dataType: 'json',
        success: function(e) 
          if (e.status) 
            alert("Registration Success")
           
        
      );
      return false;
    
  ,
);
</script>

我需要发布数据

subcategory : healthcare,education

谁能帮我解决这个问题？

【问题讨论】：

data['subcategory'] = this.subcategory.join(',')

【参考方案1】：

this.subcategory 是一个数组，您可以像这样使用join 将其转换为字符串：

let services = [
  name: 'Hamburger',
  name: 'Sandwich',
  name: 'Hotdog'
];

submitBox = new Vue(
  el: "#submitBox",
  data: 
    subcategory: [],
  ,
  methods: 
    handelSubmit: function(e) 
      var vm = this;
      data = ;
      data['subcategory'] = this.subcategory.join(',');
      
      console.log(data);
      
      return false;
    
  ,
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>
<div id="submitBox">
  <form method="POST" onSubmit="return false;" data-parsley-validate="true" v-on:submit="handelSubmit($event);">
    <select id="basic" class="selectpicker" data-live-search="true" data-live-search-style="begins" title="Select Your City" v-model="subcategory" name="subcategory[]" multiple>
      <option v-for="so in services" v-bind:value="so.name">so.name</option>  
    </select>
    <button>Submit</button>
  </form>
</div>

【参考方案2】：

如果您只需要将subcategory 数组加入以逗号分隔的字符串, 内，只需使用：

data['subcategory'] = this.subcategory.join(',');

也许您会发现将其用作 jQuery ajax 调用的数据有用：

data: "subcategory": this.subcategory