将变量从前端传递到后端

Question

我有一个带有前端的 vue js 项目，我有一个包含变量的字段，当它发生变化时我想要它，它会转到后端并在那里改变你有什么想法吗？变量是代码中的 id 标签

app.get('/payments', (request, response) => {
  response.set('Access-Control-Allow-Origin','*')
  let payments = []


db.collection("payments").where("id", "==", idtag).get().then(snapshot => {
  snapshot.forEach((doc) => {
    console.log(doc.id, '=>', doc.data())
    payments.push(doc.data())
  })
  response.send(payments)
  console.log('payments:',payments)
})
})

这是前端

export default defineComponent({

  setup () {
    const loadinga = ref(false)
    const idtag=ref(null)
    const filter = ref('')
return {
      events: [ '2019/02/01', '2019/02/05', '2019/02/06' ],
      date : ref('2019-02-22 21:02'),
      columns,
      loadinga,
      idtag,

Answer 1

将 ID 作为请求的一部分 url:

// backend assuming this is express
app.get('/payments/:id', (request, response) => {
    // use the id in some way
    const idtag = req.params.id;
    ...
});

在您的前端代码中，您需要 watch idTag 并在每次更改时发起新请求。

// frontend
import { defineComponent, ref, watch } from "vue";

export default defineComponent({
  setup() {
    const idtag = ref(null);

    watch(idtag, (newValue, oldValue) => {
      fetch(`/payments/${newValue}`)
        .then(raw => raw.json())
        .then(data => {
          // do something with the data
          console.log(data)
        })
        .catch(console.warn);
    });

    return { idtag };
  }
})

如果您需要立即运行，您应该使用 watchEffect。但是由于你的值一开始就是null，所以我觉得不是这样的

将变量从前端传递到后端

pass variables from front to backend

javascript

node.js

vue.js

quasar

vuex