v-on:click 和 onclick 都试过了，点击没反应？求解

谢小羊的小仙女

这个页面是frame过来的，怎么点击都没有反应，不知道怎么回事，我其他页面login.html有用过v-on:click，是可以用的，这个就不行，求大神帮帮忙！

杨愿

@click呢？贴一下完整代码。我看看

谢小羊的小仙女

杨愿发表于 2018-6-22 11:21
@click呢？贴一下完整代码。我看看

三种我都试了，还是没有反应
<body>
<div id="wrap">
   <van-swipe :autoplay="3000">
      <van-swipe-item v-for="(image, index) in images" :key="index">
      <img class="wrap-img" :src=image.image />
      </van-swipe-item>
   </van-swipe>
      <div class="content">
      <img class="content-img" src="../../image/home/home-lukuang.png" />
         <div class="new-customer">
            <div class="nav">
                  <span class="customer-nav days" v-on:click="onJoinNowClick()"><i class="icon-days"></i><span> 期限20天</span></span>
                  <span class="customer-nav full" @click="onJoinNowClick()"><i class="icon-full"></i><span> 满标起息</span></span>
                  <span class="customer-nav ctrl" onclick="joinNowClick()"><i class="icon-days"></i><span> 专业风控</span></span>
            </div>
            <div class="lucky" v-for="(item, key, index) in newCustomers">
                  <h4>新手福利<i>{{item.luckyQi}}</i>期</h4>
                  <div class="lucky-wrap">
                     <div class="lucky-line1">
                        <div class="part2 left"><b>{{item.expectYears}}</b><i>%</i><span>期望年化</span></div>
                        <div class="part2 right"><b>{{item.days}}</b><i>天</i><span>期限</span></div>
                        <div class="center"></div>
                     </div>
                     <div class="lucky-line2">
                        <span class="remain-money">剩余金额：<b>{{item.remainMoney}}</b> 万元</span>
                        <span class="percent"><i :style=item.percent></i><b>{{item.moneyPercent}}%</b></span>
                     </div>
                     <button class="join-now" type="button" name="button" >立即加入</button>
                  </div>
            </div>
         </div>

         <div class="new-area">
            <h4>新手专区</h4>
            <div class="area-wrap">
                  <div class="area-line" v-for="(area, key, index) in newArea">
                     <p><span>新手福利 <i>{{area.one}}</i> 期</span><i>新手</i></p>
                     <div class="bottom">
                        <div class="bottom-one">
                              <b>15.0</b>
                              <i>%</i>
                              <span>期望年化</span>
                        </div>
                        <div class="bottom-two">
                              <i>20天</i>
                              <span>期限</span>
                        </div>
                        <div class="bottom-three">
                              <div class="bottom-circle" id="circle">
                              <van-circle
                                 v-model="area.value"
                                 :rate="area.value"
                                 :speed="100"
                                 size="1.2rem"
                                 :text="area.value.toFixed(0) + '%'"
                                 layer-color="#e6ca8e"
                                 color="#ef6c00"
                              />
                              </div>
                        </div>
                        <div class="bottom-four">
                              <button type="button" name="button">立即加入</button>
                        </div>
                     </div>
                  </div>
            </div>
         </div>
      </div>
</div>

</body>
<script type="text/javascript" src="../../script/backpack/api.js"></script>
<script type="text/javascript">
apiready = function() {
      var wrap = new Vue({
         el: '#wrap',
         data: {
            injoinStyle: '',
            newCustomers: [{
               id: '1',
               luckyQi: '889',
               remainMoney: '3.98',
               moneyPercent: '50',
               expectYears: '15.0',
               days: '20',
               percent: "",
            },
            {
            id: '2',
            luckyQi: '890',
            remainMoney: '3.78',
            moneyPercent: '70',
            expectYears: '15.0',
            days: '20',
            percent: "",
            },
            {
            id: '3',
            luckyQi: '890',
            remainMoney: '3.78',
            moneyPercent: '60',
            expectYears: '15.0',
            days: '20',
            percent: "",
            }
         ],
            newArea: [{
            one: 2356,
            value: 0,
            a: '',
            },
            {
            one: 15415,
            value: 89,
            a: '',
            b: '',
            circleContent: null,
            },
            {
               one: 15415,
               value: 89,
               a: '',
               b: '',
               circleContent: null,
            },
            {
               one: 15415,
               value: 89,
               a: '',
               b: '',
               circleContent: null,
            }],
            images: [{
            image: '../../image/home/home-img.jpg'
            },
            {
            image: '../../image/home/home-img.jpg'
            },
            {
            image: '../../image/home/home-img.jpg'
            },
            {
            image: '../../image/home/home-img.jpg'
            }]
         },
         mounted: function() {
            for(var i = 0; i <this.newCustomers.length; i++) {
            this.newCustomers.percent = 'width:' + 4.7 * (this.newCustomers.moneyPercent/100) + 'rem;';
            }
         },
         methods: {
            onJoinNowClick: function () {
            api.alert({
                  title: 'testtitle',
                  msg: 'testmsg',
            });
            console.log('第三了')
            }
         }
      })
}

function joinNowClick() {
   api.alert({
      title: 'testtitle',
      msg: 'testmsg',
   }, function(ret, err){
      if( ret ){
            alert( JSON.stringify( ret ) );
      }else{
            alert( JSON.stringify( err ) );
      }
   });

}
</script>

杨愿

是不是mounted的原因，你用vm.$nextTick替换掉mounted再试试。

mounted: function () {
this.$nextTick(function () {
// Code that will run only after the
// entire view has been rendered
})
}

复制代码

谢小羊的小仙女

杨愿发表于 2018-6-22 11:42
是不是mounted的原因，你用vm.$nextTick替换掉mounted再试试。

刚刚试了一下，还是不行，波吧mounted注释了也没有反应

杨愿

你用的开发版还是发布版？开发版应该有错误提示的吧

@旺旺

@click = "onJoinNowClick"

杨愿

@旺旺发表于 2018-6-22 14:17
@click = "onJoinNowClick"

<div class="minjorTR" v-for="(item,index) in data" @click="fnOpenDedatil(item)" tapmode>
<div class="minjorTD minjorTDXH">{{ index+1 }}</div>
<div class="minjorTD">{{ item.fbfm }}</div>
<div class="minjorTD">{{ item.fbm }}</div>
<div class="minjorTD">{{ item.fctsj }}</div>
<div class="minjorTD">{{ item.fwcsj }}</div>
</div>

复制代码

/**
* api初始化
*/
apiready = function(){
/* 实例化vue*/
vm = new Vue({
el:"#minjorTable",
data:{
data:[]
},
methods:{
fnOpenDedatil:function(item){
api.openWin({
name:"plan_draw_dedatil",
url:"plan_draw_dedatil.html",
pageParam:{
drawData:item
}
});
}
}
});
initXMData();
}

复制代码

我这么用的

谢小羊的小仙女

杨愿发表于 2018-6-22 15:58
我这么用的

我在其他页面就可以用，就是登陆进去的home页面不可以，是在搞不懂，。我用的是openFrameGroup,home页面是第一个页面，其他三个页面都是可以用的

杨愿

谢小羊的小仙女发表于 2018-6-22 16:34
我在其他页面就可以用，就是登陆进去的home页面不可以，是在搞不懂，。我用的是openFrameGroup,home页面 ...

我也搞不懂，反正我把你代码跑起来，vue是报错的。

[其他] v-on:click 和 onclick 都试过了，点击没反应？求解