ホームページ > ウェブフロントエンド > Vue.js > vuejs el の用途は何ですか?

vuejs el の用途は何ですか?

青灯夜游
リリース: 2021-09-18 17:58:43
オリジナル
3258 人が閲覧しました

vuejs では、el の機能は Vue インスタンスのマウント ターゲットを指定することであり、インスタンスのマウント後に、ページ上に既に存在する DOM 要素を Vue インスタンスのマウント ターゲットとして提供します。 、要素は「vm.$el」を使用してアクセスできます。

vuejs el の用途は何ですか?

このチュートリアルの動作環境: Windows7 システム、vue2.9.6 バージョン、DELL G3 コンピューター。

vue 公式 API ドキュメントでは、el に次の説明があります:

https://cn.vuejs.org/v2/api/#el

# Vue インスタンスのマウント先を指定するために使用される

##el の役割は誰もが知っています。上記の 2 つの赤い感嘆符の部分に注目します。要約すると:

レンダリング関数またはテンプレート属性がある場合、マウントされた要素は Vue によって生成された DOM に置き換えられます。それ以外の場合は、マウントされた要素が配置されている HTMLテンプレートを作成します

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div id="ppp"></div>
  </body>
</html>
ログイン後にコピー

例 1: render 関数によってレンダリングされた DOM を置き換えます

new Vue({
  el: &#39;#ppp&#39;,
  router,
  store, 
  render: h => h(App)
})
ログイン後にコピー

例 2: 文字列テンプレートの置換

new Vue({
  el: &#39;#ppp&#39;,
  router,
  components: { App },
  template: &#39;<App/>&#39;
})
ログイン後にコピー

例 3: 手動マウントレンダリングは存在しません 関数とテンプレートの属性

new Vue({
  router,
  store,
}).$mount(&#39;#ppp&#39;)
ログイン後にコピー

関連する推奨事項:「

vue.js チュートリアル

以上がvuejs el の用途は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート