为什么vux报错,this.$vux.confirm.prompt is not a function?

发布于 2022-09-06 10:57:12 字数 2707 浏览 15 评论 0

错误:

图片描述

代码:

<template>
<div class="g-inherit m-main p-general" v-if="myInfo.account">

<group class="u-card">
  <cell :title="myInfo.nick" :inline-desc="'帐号: ' + myInfo.account">
    <img class="icon" slot="icon" width="20" :src="myInfo.avatar">
  </cell>
</group>
<group class="u-card">
  <cell title="昵称">{{myInfo.nick || ''}}</cell>
  <cell title="性别">{{myInfo.gender}}</cell>
  <cell title="生日">{{myInfo.birth}}</cell>
  <cell title="手机">{{myInfo.tel}}</cell>
  <cell title="邮箱">{{myInfo.email}}</cell>
  <cell title="签名">{{myInfo.sign}}</cell>
</group>
<div>
  <x-button type="warn" action-type="button" @click.native="logout">注销</x-button>
</div>
<div v-transfer-dom>
  <confirm v-model="show"
  title="confirm title"
  @on-cancel="onCancel"
  @on-confirm="onConfirm"
  @on-show="onShow"
  @on-hide="onHide">
    <p style="text-align:center;">{{ 'Are you sure?' }}</p>
  </confirm>
</div>
<br>
<div style="padding:15px;">
  <x-button @click.native="showPlugin" type="primary">{{ 'show' }}</x-button>
</div>

</div>
</template>

<script>
import Vue from 'vue'
import { Group, Cell, Confirm, TransferDomDirective as TransferDom } from 'vux'
export default {
directives: {

TransferDom

},
components: {

Group,
Cell,
Confirm

},
data () {

return {
  show : false
}

},
computed: {

myInfo () {
  return this.$store.state.myInfo
}

},
methods: {

logout () {
  let that = this
  this.$vux.confirm.show({
    title: '确定要注销帐号?',
    onConfirm () {
      that.$store.dispatch('logout')
    }
  })
},
onCancel(){
  console.log('on cancel')
},
onConfirm(msg){
    console.log('on confirm')
    if(msg){
      alert(msg)
    }
},
onHide(){
  console.log('on hide')
},
onShow(){
  console.log('on show')
},
showPlugin () {
  const _this = this
  this.$vux.confirm.prompt('123', {
    title: 'Title',
    onShow () {
      console.log('promt show')
      _this.$vux.confirm.setInputValue('set input value')
    },
    onHide () {
      console.log('prompt hide')
    },
    onCancel () {
      console.log('prompt cancel')
    },
    onConfirm (msg) {
      alert(msg)
    }
  })
}

}
}
</script>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

爱的那么颓废 2022-09-13 10:57:12

confirm的其他方法都能生效就prompt不生效吗?

你可以向vue注册这个组件

import  { ConfirmPlugin } from 'vux'
Vue.use(ConfirmPlugin)
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文