title: How to display view in vue js based on object data?
body: <p>I have a problem with javascript. I have data as contained in variable datas. I want to display data from the data variable in a table form as below.</p>
  <p><a href="https://i.stack.imgur.com/ygUDF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ygUDF.png" alt="enter image description here" /></a></p>
  <p>the meaning of etc is the date of the dateTo field in the data object. To be clear, the dateFrom and dateTo fields, which are originally date ranges, will be outputted into a date array starting from the date in dateFrom to the date in dateTo. For the date format to be used is new Date(). What I'm thinking is the possibility of using computed or method to get the contents for arrayDates based on dateFrom and dateTo. The overview of output for the date array is something like this: <br></p>
  <p>arrayDates:[&quot;2022-01-24&quot;, &quot;2022-01-25&quot;, &quot;2022-01-26&quot;, ... &quot;2022-02-28&quot;]. <br></p>
  <p>Does anyone understand the case I have? Thanks.</p>
  <pre><code>&lt;script&gt;
  export default {
      data(){
          return {
             datas: [
                  {
                      &quot;id&quot;: 1,
                      &quot;name&quot;: &quot;Sandra Brooke&quot;,
                      &quot;schedule_time&quot;: [
                          { &quot;id&quot;: 1,
                            &quot;dateFrom&quot;: &quot;2022-01-24&quot;,
                            &quot;dateTo&quot;: &quot;2022-02-28&quot;,
                            &quot;schedule_day&quot;: [
                              {&quot;id&quot; 1,&quot;days&quot;: &quot;Monday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 2,&quot;days&quot;: &quot;Tuesday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 3,&quot;days&quot;: &quot;Wednesday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 4,&quot;days&quot;: &quot;Thursday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 5,&quot;days&quot;: &quot;Friday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;16:00:00&quot;},
                            ]
                          }
                      ]
                  },
                  {
                      &quot;id&quot;: 2,
                      &quot;name&quot;: &quot;Michael Anderson&quot;,
                      &quot;schedule_time&quot;: [
                          { &quot;id&quot;: 1,
                            &quot;dateFrom&quot;: &quot;2022-01-24&quot;,
                            &quot;dateTo&quot;: &quot;2022-02-28&quot;,
                            &quot;schedule_day&quot;: [
                              {&quot;id&quot; 1,&quot;days&quot;: &quot;Monday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 2,&quot;days&quot;: &quot;Tuesday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 3,&quot;days&quot;: &quot;Wednesday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 4,&quot;days&quot;: &quot;Thursday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 5,&quot;days&quot;: &quot;Friday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;16:00:00&quot;},
                            ]
                          }
                      ]
                  },
                  {
                      &quot;id&quot;: 3,
                      &quot;name&quot;: &quot;Sarah Black&quot;,
                      &quot;schedule_time&quot;: [
                          { &quot;id&quot;: 1,
                            &quot;dateFrom&quot;: &quot;2022-01-24&quot;,
                            &quot;dateTo&quot;: &quot;2022-02-28&quot;,
                            &quot;schedule_day&quot;: [
                              {&quot;id&quot; 1,&quot;days&quot;: &quot;Monday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 2,&quot;days&quot;: &quot;Tuesday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 3,&quot;days&quot;: &quot;Wednesday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 4,&quot;days&quot;: &quot;Thursday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;18:00:00&quot;},
                              {&quot;id&quot; 5,&quot;days&quot;: &quot;Friday&quot;, &quot;startTime&quot;: &quot;08:00:00&quot;, &quot;endTime&quot;: &quot;16:00:00&quot;},
                            ]
                          }
                      ]
                  },
              ],
          }
      },
  
      methods: {
          
      },
  
  }
  </code></pre>