import form input in one file and import into another file as input to async function

Viewed 28

I thought I could json.stringify my form input with a specific id , but I suppose I cannot do it from outside of the file itself.

I have an input in my main UI file (.vue) but want to import it into a function in another js file that my button calls to.

If I try to pass that value from the homepage file with the same id as labeled in the form input, it still shows undefined error.

Am I incorrectly formatting the form itself with the ID? Do I need a $ prefix on the form ID? Thanks for any help in advance

home.vue

< input type=text value="InputAmount" id="forminput"/>

otherfile.js

async function({commit}, accountName) {
    if (state.debug) {
        console.log("Contribution");
    }
    try {

        const publickey = state.accountData[0]["data"]["guard"]["keys"][0];
        const accountName2 = localStorage.getItem("accountName");
        const forminput = localstorage.getItem("forminput") //to come from home.vue input
1 Answers

From the way I understood, you basically want to use localStorage as global "store"? Input value does not automatically get saved to localStorage, and we need to set it. Here I'm using writable computed

This would sync the input value to localStorage value "formInputValue"

<script>
export default {
  name: 
  data() {
    return {}
  },
  computed: {
    inputAmount: {
      // getter
      get() {
        return localStorage.getItem('formInputAmount')
      },
      // setter
      set(newValue) {
        localStorage.setItem('formInputAmount', newValue)
      }
    }
  },
}
</script>

<template>
  <input type=text v-model="inputAmount"/>
</template>

But this is probably not exactly what you are trying to do, and probably isn't the best way to do it, if you can provide some more details perhaps we can find more "proper" pattern for your use case.

Related