在vue和webapi中，免不了在json字串和json對像間相互轉換，把常用的轉換記錄一下，下面是前端中用到的陣列例子

    this.title.push({
         name:‘輸入標題‘,list:[{
             name:‘選項一‘,fen:0
            },{
              name:‘選項二‘,fen:0
             },{
               name:‘選項三‘,]
            })

一、Vue中把一個數組轉換成json字串

1、在scrpit中定義陣列 title:[]，數組裡可以放你任何喜歡的內容

2、在自定義函式中進行轉換letstr=JSON.stringify(this.title);

那麼str就是一個可以在C# webapi中識別的json字串了，怎麼識別看第三個

二、webapi中把對像轉換成json字串

如把查詢到的DataTable對像轉換成json字串，返給前端的vue解析使用

public static string DataTableToJSON(DataTable Dt)
{
     var res = JsonConvert.SerializeObject(Dt);
     return res;
}

如果想把任意對像轉換成json字串，也可以使用JsonConvert.SerializeObject來進行轉換

三、vue傳送的json陣列字串轉換成jarray陣列對像

如果vue前端把一個數組轉換成了json字串，並post給了webapi，那麼在後端怎麼識別解析它了？

我們可以把它先轉換成jarray陣列對像，然後再轉換成json對像，就能讀取了。

JArray ja = JArray.Parse(mes);   //mes為前端返回的json字串

ja為一個數組，那麼每一個ja都可以轉換成JObject對像，然後進行讀取

JArray ja = JArray.Parse(mes);  //轉換成陣列對像
for (int i = 0; i < ja.Count; i++)
{
   JObject jo 
 
= JObject.Parse(ja[i].ToString());
   string name= jo["name"].ToString();  
｝                   

如果jo中還有陣列怎麼辦，那就繼續轉換吧

JArray js = JArray.Parse(jo["list"].ToString()); //轉換jo中的list

然後再用for就行了

四、webapi查詢結果轉成json字串陣列（字串陣列拼接）

類似於第二種，但是這種更像是表中表查詢，最後出來的結果如前端用到的title格式。

s1 = KS.DataTableToJSON(KS.GetTable(sql));
JArray j_tm = JArray.Parse(s1);
JArray ja = new JArray();

如上，先查詢一個表，並轉換成json字串，然後再轉換成JArray陣列，並定義一個新的陣列，用於在後面存放拼接過的json字串

 for (int i = 0; i < j_tm.Count; i++)
      {
          JObject jo = JObject.Parse(j_tm[i].ToString());
          string wjid = jo["id"].ToString();
          sql = "select "; //寫自己的查詢內容
          string info=""; //此處為例子，改成自己查詢出的內容
          jo.Add("list",info);
          ja.Add(jo);
      ｝        

主要在於如何給JObject增加一個節點，然後把jo對像增加到ja陣列中。此處實現的是前面 list節點中的內容

ja陣列如何轉換成字串了，非常簡單，直接tostring就可以了

mes =ja.ToString();
mes = mes.Replace("\\","").Replace("\"[","[").Replace("]\"","]");

但是會發現返回給前端的json字串陣列前端並不能很好的識別，經過對比發現裡面多了斜槓和雙引號，那麼替換掉就沒有問題了。

最後在前端實現的效果如下：

而在後端，標題和選項是分開在兩個表中儲存的。

存放標題的表

存放選項的表