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

QQ登录

只需一步,快速开始

 找回密码
 立即注册

QQ登录

只需一步,快速开始

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

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

[复制链接]
跳转到指定楼层
楼主
发表于 2018-8-6 20:07:33 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
php-html" B: G$ T4 b0 |. {3 s* v
  1. <div id = "computed_props{$v['id']}">  g8 T% l/ B9 S9 P
  2.         <input style="width:50px;"  type = "text" v-model = "kilometers" placeholder="20" >
    & K$ Z" x& `- j6 y$ s
  3.         <a class="btn btn-xs btn-info" style="display:inline-block;"  v-bind:href="url" >修改比例为{{meters}}</a>5 i0 |, C) F2 b# Q8 r# a
  4. </div>
复制代码
vue.js+ O* b# S4 z& V. G7 I" e, o
  1. <script type = "text/javascript">! \- N- e. b$ z/ K5 s
  2.                 / W" b0 z0 P% d. Y
  3.                 var ids = <?=$v['id']?>;
    ; |  I8 u0 ]) L& d4 u# [6 \( z
  4.                 var shop_xjcbl = <?=$v['shop_xjcbl']?>;
    3 h) R* J1 q! S$ j! u8 S
  5.                
    0 R; t" F; _- w  t) F. T( K
  6.          var vm = new Vue({
    % g  x$ L2 g& f5 N5 Z! a4 W( s4 U6 {5 V
  7.             el: '#computed_props'+<?=$v['id']?>,
    7 C1 Q3 K8 Q4 j% a8 ^
  8.             data: {
    ! G( Z! `0 h/ J' h
  9.                kilometers : <?=$v['shop_xjcbl']?>,
    " x$ Q* B+ O& A( I0 C% G
  10.                meters: <?=$v['shop_xjcbl']?>,9 b3 J6 l3 K' f& W* D5 M- @1 c
  11.                            id:<?=$v['id']?>,3 K! u  B0 R) i  @
  12.                            url:'/nc.php?s=/goods/xiugaibili/id/'+ids+'/shop_xjcbl/'+shop_xjcbl+'.html',9 o$ c$ M  B9 I5 J( w9 g& v( e
  13.             },1 t! G  q8 [, t
  14.             methods: {9 a2 I# U& H$ f) ^7 x' D
  15.                        
    ( X/ y. P0 L9 v) B' y
  16.             },
    6 l0 ~; T: f; ]7 G* d- O
  17.             computed :{7 a+ w5 U' i3 G3 A- C5 I& t- g
  18.             },
    1 E: k% H4 {. h4 D# w% p5 [/ b
  19.             watch : {
    8 U  t5 }( d# q. X/ e  @
  20.                kilometers:function(val) {
    - L" O9 j' `, Z3 x% w: o' [0 o
  21.                   this.kilometers = val;
    2 T' ]1 j. T$ s1 y
  22.                   this.meters = val ;4 w1 X8 {  D. v6 [0 _% x6 w3 W
  23.                                   this.url = '/nc.php?s=/goods/xiugaibili/id/'+this.id+'/shop_xjcbl/'+this.kilometers+'.html';$ n( J5 v7 J  s$ I, V& U' c
  24.                }," ^( C  v9 n! w
  25.                meters : function (val) {3 P" o! B) o  A2 N1 \% C
  26.                   this.kilometers = val;9 Q: e# g, z* d9 g
  27.                   this.meters = val;8 M" _2 b+ e$ _/ T
  28.                }' p0 H6 X' k7 V6 W/ o6 K  V7 U
  29.             }" _  a" \) k8 S6 J
  30.          });7 F6 `/ K- ^  \3 G
  31. & j2 G9 G7 X' D6 B
  32. ; E; `- L+ S4 f
  33. </script>
复制代码
' J  z: b' ]$ Z& Q; O( t

9 Y4 r+ F) b, G6 S: N
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 支持支持 反对反对
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

GMT+8, 2026-3-16 18:45 , Processed in 0.052325 second(s), 20 queries .

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