Vue v-for组件问题中的数据

时间:2019-12-07 18:30:35

标签: vue.js v-for

我正在尝试使用v-for制作var count_row具有via循环的组件。但是存在问题,因为组件中的数据中的变量count_row = 3,并且我需要在模板中使用确切的数据,而不是在Vue数据中使用。我尝试也使用<li v-for='i in this.count_row'>,但是它也不起作用。我尽可能地用Google搜索,但是我不知道如何解决这个简单的问题。

 Vue.component('addinvexisting',{
   delimiters: ['[[', ']]'],
   props:['id_inv'],
   template:`
   <div>


   <table class="table">

 <tbody>
   <tr>     
    <td><input type="text" v-model='count' name="#count" class="form- 
   control" />[[count]]</td>
    <td><textarea v-model='description' class="form-control" />[[description]]</td>
    <td><input type="text" v-model='quantity' name='quan-ty' class="form-control" />[[quantity]]</td>
    <td><input type="text" v-model='unit' class="form-control" />[[unit]]</td>
    <td><input type="text" v-model='price' name='price' class="form-control" />[[price]]</td>
    <td><input type="text" v-model='tt'  name='summTotal_w_VAT' class="form-control" />[[countSumm]]</td>
    <td>
    <select v-model='selected' class='form-control'>
        <option disabled value=''>Укажите размер НДС</option>
        <option>20</option>
        <option>0</option>
        <option>БЕЗ НДС</option>
     </select>   
        [[selected]]</td>

    <td><input type="text" class="form-control" v-model='total_t_vat'/>[[countVat]]</td>

     <td><button >Записать</button></td>


     </tr>
 </tbody>
</table>


    </div>
   `,


   data() {
      return {
         count: "",
         description: "",
         quantity: "",
         unit: "",
         amount:"",
         price: "",
         total:'',
         total_t_vat:this.countVat,
         tt:this.countSumm,
         vat: '',
         selected:'',
         count_row:3,

      }
   },



   computed:{

      countSumm(){

            this.tt = parseInt(this.price) * parseInt(this.quantity);
            this.total = this.tt
            return this.tt, this.total
      },


      countVat(){
         var c_vat =''
         if (this.price !='' & this.selected !='БЕЗ НДС'){
            c_vat = (100-parseInt(this.selected))/100
            return this.total_t_vat= parseInt(this.total)/c_vat
         }else if(this.selected =='БЕЗ НДС'){
            c_vat = parseInt(1)
            return this.total_t_vat= parseInt(this.total)/c_vat

         }
         else{
            this.price=this.price }

      },

   },
})


 const helloWorld = new Vue({
   delimiters: ['[[', ']]'],
   el: '#helloVue',

   data: {

      invs:invoices,

      inv:[
         {'path': '', 'invoice_number': '11' },
         {'path': '', 'invoice_number': '12' }
      ],
      message: 'This is the message',
      name: "",

   },

   methods: {

   },


});

  <div id='helloVue'>
    <ul>
        <li v-for='i in count_row'>
                <addinvexisting></addinvexisting> 
        </li>
    </ul>
  </div>

0 个答案:

没有答案