您尚未登录,请登录后浏览更多内容! 登录 | 立即注册

QQ登录

只需一步,快速开始

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 13582|回复: 0
打印 上一主题 下一主题

[Vue.js] 实现 tp循环输出el

[复制链接]
跳转到指定楼层
楼主
发表于 2018-8-6 20:07:33 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
php-html7 A/ ^2 h4 E% X  r$ R- K
  1. <div id = "computed_props{$v['id']}">$ u7 c# t) F- `, l5 K/ a, M
  2.         <input style="width:50px;"  type = "text" v-model = "kilometers" placeholder="20" >
    ; P6 I7 Y3 f5 S0 {8 l
  3.         <a class="btn btn-xs btn-info" style="display:inline-block;"  v-bind:href="url" >修改比例为{{meters}}</a>4 D3 _6 N+ K( h8 ]% d
  4. </div>
复制代码
vue.js) i# n( R0 \  [0 r( k/ C; i% p8 `8 K
  1. <script type = "text/javascript">; H% \9 g1 T* a( E- d4 @. D
  2.                 5 n8 R2 |0 e6 f2 u
  3.                 var ids = <?=$v['id']?>;- A: d) U2 C3 O3 V/ E: V  H
  4.                 var shop_xjcbl = <?=$v['shop_xjcbl']?>;: N  @1 W. T; `/ u7 g
  5.                
    3 R; o1 o$ h3 S( Y9 w8 Y
  6.          var vm = new Vue({- {2 R2 q6 U' \; M
  7.             el: '#computed_props'+<?=$v['id']?>,1 b0 L7 {7 k( l8 E. }" v
  8.             data: {( P) i4 J, n; E: F* F- N
  9.                kilometers : <?=$v['shop_xjcbl']?>,) l% \" f6 [9 }( ?1 Q
  10.                meters: <?=$v['shop_xjcbl']?>,2 ?2 R' L( _. s( g9 V9 K! o
  11.                            id:<?=$v['id']?>,
    ' i4 A. a+ h: D( V' a* D
  12.                            url:'/nc.php?s=/goods/xiugaibili/id/'+ids+'/shop_xjcbl/'+shop_xjcbl+'.html',
    8 x7 y4 H: q# q3 _9 t5 \  b4 O
  13.             },
    4 V( r3 K& z4 O( c( T5 J
  14.             methods: {
    1 ~$ h" c0 U6 o# Q+ _; J5 U4 z
  15.                         # P/ I# p/ J! h. `4 L- Y! }
  16.             },
    0 `( F# w4 B3 d5 W6 R/ ?# l
  17.             computed :{3 j5 m' `& u" m' C7 [/ U
  18.             },7 ~9 d! @( S; Y8 |, E% u, X
  19.             watch : {8 X2 d  o0 z8 l0 H) P
  20.                kilometers:function(val) {- Y6 G; Z- _% M' X, d* Q4 O
  21.                   this.kilometers = val;
    # i# i9 ]% l- E$ _. O/ r9 M" B
  22.                   this.meters = val ;
    8 D  M* [4 R' a
  23.                                   this.url = '/nc.php?s=/goods/xiugaibili/id/'+this.id+'/shop_xjcbl/'+this.kilometers+'.html';
    9 G4 y& r- {5 ?! \
  24.                },. q: N$ n1 u( W% L- J( t3 s
  25.                meters : function (val) {
    6 R& Y; }! f+ p+ E) c; H
  26.                   this.kilometers = val;
    - s" c, J9 t! g$ B% o
  27.                   this.meters = val;
    6 i( x! r1 A/ z. P8 {
  28.                }
    4 l; c4 |( U! X$ Y
  29.             }6 \+ A3 s; q' \# b' P+ N. @% r# g
  30.          });" a5 H4 c: a% c& H  g1 ^/ u9 G' m
  31. 5 a( y: A3 I$ s6 b/ @* A
  32. 3 E( @0 a+ [5 M: a  r
  33. </script>
复制代码

6 o, T  h. g$ U/ b& D8 j% S8 I/ H
: V- q% y0 ?  @  A1 J! m
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 支持支持 反对反对
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

GMT+8, 2026-3-16 21:50 , Processed in 0.061062 second(s), 19 queries .

Copyright © 2001-2026 Powered by cncml! X3.2. Theme By cncml!