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

QQ登录

只需一步,快速开始

 找回密码
 立即注册

QQ登录

只需一步,快速开始

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

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

[复制链接]
跳转到指定楼层
楼主
发表于 2018-8-6 20:07:33 | 只看该作者 回帖奖励 |正序浏览 |阅读模式
php-html5 o/ N5 u2 K! w& c  B
  1. <div id = "computed_props{$v['id']}">
    7 N2 L) I( @* ^: h" G; A- L
  2.         <input style="width:50px;"  type = "text" v-model = "kilometers" placeholder="20" >
    5 o5 f  Y3 N8 \7 u& r
  3.         <a class="btn btn-xs btn-info" style="display:inline-block;"  v-bind:href="url" >修改比例为{{meters}}</a>' [0 D5 v4 W/ L$ ?9 V2 i
  4. </div>
复制代码
vue.js
; I7 k4 _. X( X! e! @. i
  1. <script type = "text/javascript">( o) Y/ X% F$ m- n
  2.                
    ) o9 Q, O4 R4 \% t5 Q
  3.                 var ids = <?=$v['id']?>;# S" j" I* n3 }
  4.                 var shop_xjcbl = <?=$v['shop_xjcbl']?>;
    $ A; j8 G; T/ l1 r, e4 N' U! ?
  5.                 ' _1 I  a3 U* x% x0 e
  6.          var vm = new Vue({/ @( B- I9 Q) ?( e$ _
  7.             el: '#computed_props'+<?=$v['id']?>,8 N1 b0 [$ E' f$ E1 A
  8.             data: {! R# U$ {# b8 z
  9.                kilometers : <?=$v['shop_xjcbl']?>,- O0 t% e7 C& s, E. m% G% E& {
  10.                meters: <?=$v['shop_xjcbl']?>,) Q. e' o8 x- n4 @3 {6 h. N
  11.                            id:<?=$v['id']?>,
    3 u' J9 j) q# l' [( \0 J; ?+ ]
  12.                            url:'/nc.php?s=/goods/xiugaibili/id/'+ids+'/shop_xjcbl/'+shop_xjcbl+'.html',
    7 R6 y# j# E: Q8 S9 x
  13.             },( @( d* a/ v6 _3 c3 S: Q; o6 l
  14.             methods: {1 k" p1 ^( s9 j" S, X; m/ L
  15.                        
    - `# g% [% ^8 M& H- t" H3 X5 C' y, D
  16.             },
    ; c/ c" p5 J. p; m6 v
  17.             computed :{3 T) v2 a8 L4 x9 q. K, ^' f- W
  18.             },5 _0 L1 o% k# g5 V( F) y9 E/ {
  19.             watch : {, q2 P3 Z. ?, ?6 m
  20.                kilometers:function(val) {! h$ R3 \5 ?/ \
  21.                   this.kilometers = val;
    " N0 c: _2 t" [6 k
  22.                   this.meters = val ;
    ) D  c- _& N: e3 f7 N
  23.                                   this.url = '/nc.php?s=/goods/xiugaibili/id/'+this.id+'/shop_xjcbl/'+this.kilometers+'.html';4 ^5 M! r$ C. u+ @/ b4 n
  24.                },& ^$ h6 P) D/ _/ C
  25.                meters : function (val) {
    # B# C9 ^5 w+ v, }
  26.                   this.kilometers = val;4 c5 Y0 r9 O" R" O. e+ q5 ]6 L
  27.                   this.meters = val;
      ?; {) M0 A! [6 d/ f% {+ f' e5 K
  28.                }% h, r4 b1 q9 y/ u$ _5 O0 k
  29.             }" v! T" m3 I! b- L5 h+ x
  30.          });
    4 o; k$ W# q0 F
  31. & Q% R1 Y+ p& I. p
  32. ( Y3 R; X# M! m7 f, h3 I
  33. </script>
复制代码
' c* C0 ?2 H# ~" E$ `3 H; m

" H+ M3 J, j& d9 z, `8 k' q
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 支持支持 反对反对
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

GMT+8, 2026-1-30 15:01 , Processed in 0.049203 second(s), 20 queries .

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