Home App Docs Blog Github

Passing down data to vue and receving it in builder.io

//vue code
<template>
  <div v-if="notFound">
    <!-- Show your 404 content -->
    Page not found
  </div>
  <div v-else>
    <RenderContent
      model="home"
      @contentLoaded="contentLoaded"
      :data="{
        auth: 'false',
        loc: 'NY',
      }"
    />
  </div>
</template>

<script>
import { builder, RenderContent, Builder } from "@builder.io/vue";

// TODO: enter your public API key
builder.init("MY-API-KEY");

export default {
  data: () => ({
    notFound: false,
  }),
  components: { RenderContent },
  methods: {
    contentLoaded(content) {
      const isEditingOrPreviewing = Builder.isEditing || Builder.isPreviewing;
      if (!content && !isEditingOrPreviewing) {
        this.notFound = true;
      }
    },
  },
};
</script>

//React code
import { BuilderComponent, builder } from '@builder.io/react'
import {useState,useEffect} from 'react'
builder.init('MY-API-KEY')
  
export const App = () => {
  const [builderContentJson, setBuilderContentJson] = useState(null)

  useEffect(() => { 
    builder.get('spud-home', { url: location.pathname })
      .promise().then(setBuilderContentJson)
  }, [])

  return <BuilderComponent model="home" content={builderContentJson}   data={{
    auth: "false",
    loc:"NY"
  }} />
}


export default App;

how to access those auth,loc data in my builder.io? state.auth and state.loc doesn’t working.same time auth and loc data are not avaliable in my state object.Meantime if i use react code those data are avaliable in my state object . what is the correct method to passing down the data to builder.io using vue

//builder.io custom code with vue
console.log(state,"state") 
console.log(state.loc) // undefined
//builder.io custom code with react
console.log(state,"state") 
console.log(state.loc) // "NY"

@prasad this seems to be a duplicate of Passing down data from vue to builder.io - #2 by TimG

Please let us know if you have any other questions, otherwise we can continue the conversation there