Vue Vant 實現頂部關鍵字搜尋欄

2022-06-23 16:21:17 字數 901 閱讀 5335

:

<

section

class

="city-search"

>

<

van-icon

class

="search-icon"

name

="search"

/>

<

input

placeholder

="請輸入城市關鍵字"

v-model

="keyword"

>

<

van-icon

class

="clear-icon"

name

="clear"

v-show

="keyword"

@click

="clearsearchinput"

/>

section

>

此時效果圖:

很明顯需要新增 css 美化。

css 如下:

.city-search input .clear-icon }
新增方法:

data() 

},methods:

}

此時介面如下:

我們可以看到,已經是乙個相對美觀的布局了。

new關鍵字 this關鍵字 base關鍵字

使用new,所做的三件事 1.類是引用物件,引用物件是在堆中開闢空間 在堆中開闢空間 2.在開闢的堆空間中建立物件 3.呼叫物件的構建函式 4.隱藏父類成員 子類的成員可以與隱藏從父類繼承的成員,類似於重寫。public new void sayhello this關鍵字的使用 1.代表當前類的物件...

this關鍵字 static關鍵字

1.當成員變數和區域性變數重名,可以用關鍵字this來區分 this 代表物件,代表那個物件呢?當前物件 this就是所在函式所屬物件的引用 簡單說 那個物件呼叫了this所在的函式,this就代表哪個物件 this也可以用於在建構函式中呼叫其他建構函式 注意 只能定義在建構函式的第一行,因為初始化...

base關鍵字 this關鍵字

用於在派生類中實現對基類公有或者受保護成員的訪問,但是只侷限在建構函式 例項方法和例項屬性訪問器中。功能主要包括 1 呼叫基類上已被其他方法重寫的方法。2 指定建立派生類例項時應呼叫的基類建構函式。base常用於,在派生類物件初始化時和基類進行通訊。base可以訪問基類的公有成員和受保護成員,私有成...