时间戳

首页 > 解决方案 > Vue.js 将变量从一个组件传递到另一个组件（jQuery）

javascript - Vue.js 将变量从一个组件传递到另一个组件（jQuery）

问题描述

我有一个名为的组件ShowComment和一个名为EditComment.

里面有ShowComment一个变量this.CommentRecID。我想在组件中使用这个变量EditComment。

问题是 aconsole.log(this.CommentRecID);表明该变量未定义 in EditComment，但已定义 in ShowComment，但我不知道为什么它未定义：

在此处输入图像描述

我用它来“使用” this.CommentRecIDin EditComment，但我不知道这是否是正确的方法，因为它与 jquery 相关：

import * as $ from "jquery";
import DatePicker from "vue2-datepicker";

export default {
    props: ["CommentRecID"],
    components: { DatePicker },

这是完整的ShowComment组件：https ://pastebin.com/fcy4PCq0

这是完整的Editcomment组件：https ://pastebin.com/uik7EwD1

我对 Vue.js 还很陌生。有人知道如何解决这个问题吗？

标签： javascriptjqueryvue.jsvariables

解决方案

你不应该同时使用 jQuery和Vue.js。

您应该尝试使用道具将数据从父母发送到孩子。

你可以在你的东西中添加EditComment一个元素，如下所示：ShowComment

<EditComment CommentRecID="this.CommentRecID" v-if="showEdit" />

并从方法中切换showEdit标志editItem

editItem() {
 this.showEdit = true
}

如果你想显示一个模式，那么你的EditComment组件可能在树上，所以你可以使用EventBus或使用Vuex.

看起来您已经Vuex在项目中使用了，所以添加一个存储 的突变CommentRecID并以类似的方式使用它来显示对话框。

推荐阅读