两次撞击触发器观察效应

发布于 2025-02-03 01:57:40 字数 859 浏览 2 评论 0原文

我将VUEJS 3与组合API一起使用。

一个带有参数的组件看起来像这样:https://webiste/eaccem/1/4/2022,其中1 = id,4 =一个月。

在该组件中,我有2个链接可以转到下个月或上个月:

<router-link
  :to="{ name: 'comptes', params: {id: 1, month: nextmonth, year: nextyear } }"
  class="text-sky-600">next month</router-link>

nexmonthnextyear是计算出的属性,这些属性是...如果需要)。

我在每次路由参数更改时运行Axios调用:

<script setup>
import { ref, onMounted, computed, watchEffect } from "vue"

const getaccounts = async () => {
  // axios get results and put into ref ; cut for clarity
}
  
onMounted(() => {
  getaccounts()  
  watchEffect(() => getaccounts() )
});

显然,第一次加载页面时,getAccounts()方法被调用两次。我该如何改变?

I'm using vuejs 3 with the composition API.

One component with params looks like this: https://webiste/accounts/1/4/2022, where 1 = id, 4 = month.

In that component, I have 2 links to go to the next month or previous month:

<router-link
  :to="{ name: 'comptes', params: {id: 1, month: nextmonth, year: nextyear } }"
  class="text-sky-600">next month</router-link>

nexmonth and nextyear are computed properties that go ... to the next month (and year if need be).

I run the axios call each time the route params change:

<script setup>
import { ref, onMounted, computed, watchEffect } from "vue"

const getaccounts = async () => {
  // axios get results and put into ref ; cut for clarity
}
  
onMounted(() => {
  getaccounts()  
  watchEffect(() => getaccounts() )
});

Obviously, the first time the page is loaded, the getAccounts() method gets called twice. How can I change that?

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

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

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文