data() {//Storing data}]。"/> data() {//Storing data}]。">

ホームページ >ウェブフロントエンド >Vue.js >vue.js で要素の高さを動的に設定する方法

vue.js で要素の高さを動的に設定する方法

王林
王林オリジナル
2021-10-09 17:42:215428ブラウズ

要素の高さを動的に設定する

vue.js メソッド: [d04fcf98c7c315a5d55dc020e0d4da5f16b28748ea4df4d9c2150843fecfba68data() {//Storing data} 】。

vue.js で要素の高さを動的に設定する方法

#この記事の動作環境: Windows10 システム、vue.js 2.9、thinkpad t480 コンピューター。

早速、次のコードに直接進みましょう:

vue code:

<div :style="{width: divWidth, height: divHeight}"></div>

data data:

data() {
    //这里存放数据
    return {
        divHeight:0,
        divWidth:0
    }
},

createdメソッドの割り当て

created(){
    let divWidth = document.body.clientWidth+"px";
    let divHeight = document.body.clientHeight-130+"px";
    this.divWidth = divWidth
    this.divHeight = divHeight
},

推奨される学習:

php トレーニング #

以上がvue.js で要素の高さを動的に設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。