如何在Vue Js

时间:2017-12-25 20:57:34

标签: json stringify

我试图通过 API 显示价值。我想在模板中显示 question_section 名称。我多次获取这些值意味着json中的Array对象。所以有一次我得到的价值 question_section 就像" A:ABC Xyz "但接下来的5次 null 值再次出现" B:DEF pqr "和5次 null 值。

因此,当我尝试在我的模板中显示此内容时,请未定义 null 。  我使用 JSON.stringfy(value1.question_section)然后为null,因为所有值都为null。这里我注意到它是最后一个索引(第四个索引)的打印值,但它应该打印零索引。

我的Vue代码js

    $.each(this.questionPaperAll, function( key, value) {

        $.each(value.questions, function( key1, value1) {

           if( JSON.stringify( value1.question_section) )
          {
             title = "<div style='font-weight: bold;padding-bottom: 10px'>"

              + JSON.stringify( value1.question_section)  +" &nbsp;" + 

                  value1.section_marks + "</div>\n" +

                 "<div style='font-weight: bold;padding-bottom: 10px'>" + 

                  s_no + ") " + value1.question_type_name[0].name + "

                  </div>\n" 
                   }     
                        });
              });

我的API Json Response ::我无法在这里显示完整的响应它只是我面临问题的样本..

     [ {
            "question_type_name": "4",
            "questions": [
                {
                    "question_ref_id": "DndoURx54fj7HaSF",
                    "question_section": "A : Attempt All question.",
                    "section_marks": "10", 
                    "question_name": "economics Question 122",
                },
                {
                    "question_ref_id": "8wFqcPBVruJSvYKv",
                    "question_section": "",
                    "section_marks": "10",
                    "question_name": "economics Question 127",

                },
                {
                    "question_ref_id": "VU4xhxMYO5pdGkNM",
                    "question_section": "",
                    "section_marks": "10",   
                    "question_name": "economics Question 128",
                },
               {
                    "question_ref_id": "VU4xhxMYO5pdGkNM",
                    "question_section": "",
                    "section_marks": "10",   
                    "question_name": "economics Question 128",
                },
                 {
                    "question_ref_id": "VU4xhxMYO5pdGkNM",
                    "question_section": "",
                    "section_marks": "10",   
                    "question_name": "economics Question 128",
                }
            ]
        },
        {
            "question_type_name": "1",
            "questions": [
                {
                    "question_ref_id": "e0NGIyFmsQ5EEKiX",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 333",   
                },
                {
                    "question_ref_id": "e0NGIyFmsQ5EEKiX",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 333",   
                },
                {
                    "question_ref_id": "e0NGIyFmsQ5EEKiX",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 333",   
                },
             {
                    "question_ref_id": "e0NGIyFmsQ5EEKiX",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 333",   
                },
               {
                    "question_ref_id": "e0NGIyFmsQ5EEKiX",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 333",   
                },
            ]
        },
        {
            "question_type_name": "3",
            "questions": [
                {
                    "question_ref_id": "oALoJ2nCzQm2EBbA",
                    "question_section": "B : Attempt Only 5 Question from each Question.",
                    "section_marks": "20",
                    "question_name": "economics Question 11w",
                    "marks": "1",
                },
                {
                    "question_ref_id": "YUrzwnrW2o0nXMD8",
                    "question_section": "",
                    "section_marks": "20",
                    "question_name": "economics Question 12l",
                    "marks": "1",
                },
                   {
                    "question_ref_id": "YUrzwnrW2o0nXMD8",
                    "question_section": "",
                    "section_marks": "20",
                    "question_name": "economics Question 12l",
                    "marks": "1",
                },
                {
                    "question_ref_id": "YUrzwnrW2o0nXMD8",
                    "question_section": "",
                    "section_marks": "20",
                    "question_name": "economics Question 12l",
                    "marks": "1",
                },
               {
                    "question_ref_id": "YUrzwnrW2o0nXMD8",
                    "question_section": "",
                    "section_marks": "20",
                    "question_name": "economics Question 12l",
                    "marks": "1",
                },
                  {
                    "question_ref_id": "YUrzwnrW2o0nXMD8",
                    "question_section": "",
                    "section_marks": "20",
                    "question_name": "economics Question 12l",
                    "marks": "1",
                }
            ]
        },
        {
            "question_type_name": "2",
            "questions": [
                {
                    "question_ref_id": "KztHaRUnRCLZwx8U",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 5",
                    "marks": "1",
                },
                {
                    "question_ref_id": "KztHaRUnRCLZwx8U",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 5",
                    "marks": "1",
                },
                {
                    "question_ref_id": "KztHaRUnRCLZwx8U",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 5",
                    "marks": "1",
                },
                {
                    "question_ref_id": "KztHaRUnRCLZwx8U",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 5",
                    "marks": "1",
                },
                {
                    "question_ref_id": "KztHaRUnRCLZwx8U",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 5",
                    "marks": "1",
                },
                                  {
                    "question_ref_id": "KztHaRUnRCLZwx8U",
                    "question_section": "",
                    "section_marks": null,
                    "question_name": "economics Question 5",
                    "marks": "1",
                },
            ]
        }]

这是了解问题的示例回复。你可以看到那个值的数组。其中数组问题具有键 question_section ,该值首次出现一些字符串,但在新部分未到之前全部为空。所以我只想显示那些 question_section 的值,其余的值则表示不显示。为此,我使用如果条件,但它现在正在工作。为什么我不知道?所以请更正可能代码。还解释了出了什么问题。

我还想告诉我,当我尝试检查哪个问题数组的索引正在打印时。我看到索引4是第一个数组的最后一个索引。为什么它打印最后。

questionPaperAll 是我从服务器获取API响应的数组。

1 个答案:

答案 0 :(得分:-1)

您发布的内容有很多错误。首先,您的问题中没有任何内容与PHPLaravel-5Vue.jsRestful-URL有任何关系。其次,如果您使用的是Vue,那么您不应该在JavaScript中构建HTML字符串 - 这就是模板的用途。

虽然你的问题措辞不够且相当冗长,但看​​起来你的问题是你的if声明会返回误报。

您的问题是在空字符串上调用JSON.stringify会返回两个双引号的字符串""。您可以尝试在控制台中运行以下内容,结果是2console.log(JSON.stringify('').length);

无需致电JSON.stringify。您可以简单地依赖空字符串的falsiness

if (value1.question_section) {
    /* TODO: Conditional code goes here. */
}

我建议您编辑您的问题,以便明确这是关于使用JSON.stringify而不是关于Vue.js。