Implement additional slots

[Draccano]

For my personal purposes I needed to implement different item at the beginning/ending of the item list. The code is tested. User can add additional v-slot:start and v-slot:end to the existing v-slot:default.

Example of use:

<vue-horizontal-list :items="items" options="{responsive: [{end: 576, size: 1}, {start: 576, end: 768, size: 2},{size: 3}]}">
      <template v-slot:start>
          <div class="start-item" style="background:red;">
              This is start item
          </div>
      </template>
      <template v-slot:default="{item}">
          <div class="item">
            <h5>{{item.title}}</h5>
            <p>{{item.content}}</p>
          </div>
       </template>
       <template v-slot:end>
          <div class="end-item" style="background: green;">
             This is end item
          </div>
      </template>
</vue-horizontal-list>

Example shown in the video https://streamable.com/c8fzu3

[fuxingloh]

I think this needs to be computed so that it will be updated when parent changes.

[fuxingloh]

Anyway, thanks for this commit, I will resolve the issue mentioned on my dev branch.

[Draccano]

Not problem, however I just lost commits credit reference in the project :(