提交属于当前用户的 post - 如何在 Vue 中定义客户端的关系？

Question

我正在使用 Node.js 构建应用程序，特别是 Express 服务器端和 Vue 客户端，使用 SQLite + Sequelize 来管理数据库。

部分功能是用户可以制作 post。这目前是可能的，但我需要实现一个关系，以便 post 可以与作者相关联。

我在 sequelize 中做了这个服务器端，在这方面似乎一切都很好，因为 table 列在外键和引用等方面看起来都是正确的。

所以现在我需要在提交之前以某种方式为 post 设置当前的 UserId。这是 Vue 组件的脚本元素，它将用作制作 posts.

的界面

<script>
import PostService from '@/services/PostService'

export default {
    data () {
        return {
            post: {
                title: null,
                body: null
            }
        }
    },
    methods: {
        async submit () {
            try {
                await PostService.post(this.post)
            } catch (err) {
                console.log(err.response.data.error)
            }
        }
    }
}
</script>

我正在使用 Vuex 来管理状态，登录时来自数据库的 'user' 对象响应在我的商店中简单地存储为 user。

所以我猜我所要做的就是访问用户：

post: {
    title: null,
    body: null
    UserId: this.$store.state.user.id
}

问题是每当我插入这一行时，组件都会以某种方式停止工作。执行上述操作会完全停止显示组件。所以我尝试将其默认设置为 null，然后在我的 submit 方法中执行此操作：

this.post.UserId = this.$store.state.user.id

如果我这样做，组件显示但提交方法不再运行；我也尝试了这两种没有 .id 的方法，只是为了以防万一，没有区别。

然后我尝试完全从数据模型中删除，在阅读 sequelize 可能正在为我的 post 模型生成 setUser 方法之后。所以在发送 post 之前在 submit 方法中尝试了以下方法：

this.post.setUser(this.$store.state.user)

... 该方法再次停止运行。同样，即使添加 .id。

根本没有尝试设置任何 ID，一切正常，直到服务器 returns 出现 'Post.UserID cannot be null' 错误，并且在我实现关系之前一切正常。

除了我已经尝试过的一些搜索之外，我还没有真正找到任何有用的东西。任何人都可以帮忙吗？我是 Node 的新手。

我访问了该状态的其他部分，例如 isUserLoggedIn，一切正常，在这些情况下没有发生崩溃。

Answer 1

我刚刚设法让它正常工作，我不确定为什么它突然开始工作，因为我确定我以前尝试过这个，但我通过在我的组件的脚本元素中执行以下操作解决了它：

<script>
import PostService from '@/services/PostService'

export default {
    data () {
        return {
            post: {
                title: null,
                body: null,
                UserId: null
            }
        }
    },
    methods: {
        async submit () {
            this.post.UserId = this.$store.state.user.id

            try {
                await PostService.post(this.post)
            } catch (err) {
                console.log(err.response.data.error)
            }
        }
    }
}
</script>

帖子现在可以正常创建和显示了。如果有人知道我在技术上在我的任何方法中做的不正确，请告诉我，因为我仍在学习 Node、Express 和 Vue。

提交属于当前用户的 post - 如何在 Vue 中定义客户端的关系？

Submitting a post that belongs to current user - how to define the relation on client-side in Vue?

javascript

express

vue.js

sequelize.js

vuex