如何将道具传递给 vuejs v3 中的根 App 组件? [英] how to pass props to root App component in vuejs v3?

问题描述

如何从主 div 文件夹传递一些变量:

并将其作为 VueJS v3.0 的主要 App 组件中的道具:

 名称:应用程序"，成分: {},道具: {一些变量:{类型:字符串，默认值:-"}}

解决方案

您无法使用 props 访问该属性，但是您可以使用一些 Vanilla js DOM 获取该属性的值，例如 document.getElementById("app";).getAttribute("someVariable")

const {创建应用程序} = Vue;常量应用 = {道具:["someVariable"],数据() {返回 {}},安装(){console.log(document.getElementById("app").getAttribute("someVariable"))}}const app = createApp(App)app.mount('#app')

<script src="https://unpkg.com/vue@3.0.0-rc.11/dist/vue.global.prod.js"></script><div id="app" someVariable='some value'>Vue 3 应用程序

How can i pass some variable from the main div folder:

<div 
      id="app" 
      someVariable='some value'
></div>

and to have it as a prop in the main App component in VueJS v3.0:

    name: "App",
    components: {
    },
    props: {
        someVariable: {
            type: String,
            default: "-"
        
    }
}

解决方案

You could not access that using props, but you could get the value of that attribute using some Vanilla js DOM like document.getElementById("app").getAttribute("someVariable")

const {
  createApp
} = Vue;
const App = {
  props: ["someVariable"],
  data() {
    return {

    }
  },
  mounted() {
    console.log(document.getElementById("app").getAttribute("someVariable"))
  }
}
const app = createApp(App)
app.mount('#app')

<script src="https://unpkg.com/vue@3.0.0-rc.11/dist/vue.global.prod.js"></script>

<div id="app" someVariable='some value'>
  Vue 3 app
</div>

这篇关于如何将道具传递给 vuejs v3 中的根 App 组件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！