实现 tp循环输出el

admin

php-html

1. <div id = "computed_props{$v['id']}">
   
2.         <input style="width:50px;"  type = "text" v-model = "kilometers" placeholder="20" >
   , m: a2 L1 f0 v' u4 B
3.         <a class="btn btn-xs btn-info" style="display:inline-block;"  v-bind:href="url" >修改比例为{{meters}}</a>
   
4. </div>

复制代码

vue.js
. z2 E7 m3 P0 w* c% B

1. <script type = "text/javascript">
   
2.                
   
3.                 var ids = <?=$v['id']?>;
   . U+ k% O  c# B! T2 w3 g
4.                 var shop_xjcbl = <?=$v['shop_xjcbl']?>;
   2 s0 z" ~1 ~9 S' B# v) l, k1 J# |
5.                
   ; Y$ k" N& F+ Y: P+ J) a
6.          var vm = new Vue({
   
7.             el: '#computed_props'+<?=$v['id']?>,
   
8.             data: {
   
9.                kilometers : <?=$v['shop_xjcbl']?>,
   
10.                meters: <?=$v['shop_xjcbl']?>,
    
11.                            id:<?=$v['id']?>,
    % K6 \5 ^0 X4 s" ]$ k) x
12.                            url:'/nc.php?s=/goods/xiugaibili/id/'+ids+'/shop_xjcbl/'+shop_xjcbl+'.html',
    + l) _) s( }* H2 N; y% z
13.             },
    
14.             methods: {
    
15.                        
    9 d" x; T) i) _9 U, F
16.             },
    
17.             computed :{
    * G/ l; x  f0 U3 z( U
18.             },
      V! J6 [9 e) Y' z9 U" K0 ^( V
19.             watch : {
    
20.                kilometers:function(val) {
    4 C. e0 _/ z" ]
21.                   this.kilometers = val;
    
22.                   this.meters = val ;
    4 V2 o; H( F; C$ C, E
23.                                   this.url = '/nc.php?s=/goods/xiugaibili/id/'+this.id+'/shop_xjcbl/'+this.kilometers+'.html';
    & z3 P  F0 c0 V: k/ ^8 p3 D: x
24.                },
    
25.                meters : function (val) {
    
26.                   this.kilometers = val;
    . U; q: c; x, c
27.                   this.meters = val;
    
28.                }
    
29.             }
    & o3 P! @; Z% w
30.          });
    0 v$ D9 D1 p7 c# Q7 `1 H
31. 
    " S. [4 Z& G5 C+ k( ^  X  h$ L0 c
32. 
    ; V7 N* h5 G) o  x, I
33. </script>

复制代码