JS Динамичный прогресс бар(js+vue+bootstrap)

Edwards

Junior Developer
Скриптер


index.html
HTML:
<div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"
               v-bind:style="{width: count+ '%'}">
            </div>
         </div>
         <button type="button" class="btn btn-success" v-on:click="addCount">Добавить</button>
      </div>
   </div>
  <script src="https://unpkg.com/vue@next"></script>
 <script src="./test.js"></script>

test.js
JavaScript:
const Counter = {
   data()
   {
      return {
         paramMin: 10,
         count: 1,
         paramMax: 100
      }
   },
   methods: {
      addCount()
      {
         /*    let sum =
               console.log( sum + 1 ) */

         return this.count++

      }
   }
}

Vue.createApp( Counter ).mount( '#Counter' )
 
Последнее редактирование:

Lev Angel

Developer
Команда форума
Скриптер
Довольно лаконично получилось (y)
 
Яндекс.Метрика
Верх