2

How can I send an array object between pages in Framework7? I can send variable values but cannot understand how to send objects?

I have an array object like this

    "phoneNumbers": [{
        "number": "(555) 564-8583",
        "normalizedNumber": "(555) 564-8583",
        "type": "MOBILE"
    }, {
        "number": "(415) 555-3695",
        "normalizedNumber": "(415) 555-3695",
        "type": "OTHER"
    }]

In route.js

  {
    path: '/contact/:id/:phoneNumbers/',
    componentUrl: './pages/contact.html',
  },

index.html

<a href="/contact/{{this.id}}/{{this.phoneNumbers}}/"></a>

contact.html

  <p>{{this.$route.params.id}}</p>
  <p>{{js 'return JSON.stringify(this.$route.params.phoneNumbers)'}}</p>

In contact.html it doesnt show the array object, instead it returns this

"1"
"[object Object],[object Object]"

I want to know if it is possible to send objects using Framework7's router?

Alternate approach I took was using localStorage, but is there a way in Framework7 to send objects between pages and not only variables?

4
  • Interested too, I got like this case and I resolve it by context, dependence of params I create context thats pass to page. also a local-storage its one of our solution Oct 23, 2018 at 10:29
  • one of solution is send object as string in param, and parse It in target page. (by using custom helper, or init process ... Oct 23, 2018 at 10:36
  • By resolve it by context you mean you abstract the keys in the object and send its value? That is possible but some object can be too big.
    – arjun
    Oct 23, 2018 at 10:57
  • 2
    I mean F7 context, every page has an data context can be pass to page...so that I set trigger js and navigate with context option...framework7.io/docs/routes.html (context) also this framework7.io/docs/view.html#router-api-methods-properties (router.navigate(url, options)) - router,navigate resolve your issue sure... Oct 23, 2018 at 11:27

1 Answer 1

0

It depends on the specifics of your use case but usually I make the data I want to pass global to the app by placing it in the javascript window object. It will be available to your code on the subsequent page(s) the user enters. It's more efficient than using localstorage.

window.phoneNumbers = [{
        "number": "(555) 564-8583",
        "normalizedNumber": "(555) 564-8583",
        "type": "MOBILE"
    }, {
        "number": "(415) 555-3695",
        "normalizedNumber": "(415) 555-3695",
        "type": "OTHER"
    }]

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.