Question 119013 in Firebase Question posted in
An extensive official documentation can be found here.

Firebase – How to call v-for variable to function

I am using vue3 and c_cid is important for me to implement the function. here is what I have.

<div
  class="client_card"
  type="button"
  v-for="c in all_clients"
  data-bs-toggle="modal"
  data-bs-target="#add_delievery_address"
>
  <div class="modal-footer" style="background-color: #1267aa">
    <button @click="createDelieveryAddress(`{{ c.c_cid }}`)">
      Submit Delivery Address
    </button>
  </div>
</div>

as you see in

createDelieveryAddress(`{{ c.c_cid }}`)

, I cannot call c.c_id inisde the v-for. Here is my JS:

<script>
export default {
  name: "ClientAll",
  data() {
    return {
      all_clients: [],
      client: {
        c_fullname: null,
        c_address_1: null,
        c_address_2: null,
        c_city: null,
        c_insert_date: null,
        c_post_code: null,
        c_cid: null //this is important for me to call function createDelieveryAddress
      }
    }
  },
  methods: {
    createDelieveryAddress(c_cid) {
      console.log("cannot called c_cid")
    }
  }
}
</script>

How can I call c_cid inside the modal? I’ve tried {{ }} and “ but no help.

Tags:

2

Answers


  1. 0

    <button @click="createDelieveryAddress(c.c_cid)">Submit Delivery Address</button>

    shall do the trick.

    Login or Signup to reply.
  2. 0

    First of all, you don’t need interpolation or string literals here, as @RenaudTarnec’s answer already pointed out.

    However, using

    <button @click="createDelieveryAddress(c.c_cid)" />

    will invoke createDeliveryAddress immediately, when the component is mounted, not when the button is pressed.

    Unless createDeliveryAddress is a function which should be called at mount, returning another function, which should be invoked when the button is clicked, you should probably use:

    <button @click="() => createDelieveryAddress(c.c_cid)" />

    That aside, the relation between client.c_cid (coming from client) and c.c_cid (coming from looping through members of allClients), is quite unclear.

    If you need more help, please shed more light on your data structure and the expected result/behavior.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search