這次在專案中遇到了乙個要做乙個搜尋功能,因為專案是vue的,而且是在手機端,所以對這個搜尋功能的實現和能做到什麼樣子都沒有底,在網上研究了一會,發現大家的解決方法都各有特色,有引入第三方包的,有遍歷的,確實都可以實現,但我覺得在vue中這樣的方法也太過繁瑣了,於是經過一段時間的查詢與思索後我自己寫了個簡單的方法,並記錄下自己思索的過程
第一步明確尋求
產品的一萬種奇怪要求
對於開發來說,應該要知道自己需要什麼,不需要什麼,理解pm的需求,把功能以最符合ue的樣子呈現出來,而這次的功能需求是非常簡單明瞭的,乙個搜尋框,底下是文章,搜尋框輸入的時候動態標紅,按下回車會跳到標紅的位置,簡單明瞭
第二步尋找靈感
第三步進入開發
bug的無數種奇怪煉成方式
首先我的**結構如下:
="header"
>
//頁面頭部,搜尋框部分
="search-total"
>
="search_model_zt"
>
="search"
>
="search_icon"
>
"require('img/search.png')"
/>
<
/div>
="search_input"
>
"searchitem" @keyup.enter=
"submit" placeholder=
"搜尋條文"
/>
<
/div>
<
/div>
<
/div>
<
/div>
<
/div>
="law-content"
>
//頁面內容部分,具體內容由後端傳入的datelist中的lawcontent提供
"content" v-if=
"datelist" v-html=
"changecolor(datelist.lawcontent)"
>
<
/div>
<
/div>
<
/div>
<
/template>搜尋內容把對應內容變為紅色的函式就是changecolor
changecolor
(item)
else
},
document.
getelementsbytagname
("a").
scrollintoview()
;
當頁面可以支援滑動時,scrollintoview可以把對於元素滑倒頁面頂部(預設),也可以通過引數賦值給false讓對應元素賦值到底部,僅支援原生js,jquery中沒有這個方法,那麼問題來了,我上面替換出了那麼多a標籤,怎麼能讓他們排好隊乙個乙個被呼叫了,那當然只能遍歷了,但是原生js中沒有jquery中eq那樣的選擇器,怎麼才能讓js知道我要找的是第n個a標籤呢
submit()
elseif(
this
.searchhead ==
(num -1)
)}},
原來,getelementsbytagname(「a」)返回的是帶有指定標籤名的物件的集合。通過對陣列的序列的呼叫就可以完成對方法的依次呼叫。
至此,這個簡單頁面的功能已基本實現,
原始碼
Vue專案中實現乙個日曆元件
本專案是乙個pc端的專案,使用已有的元件,沒有找到pc端的,所以需要自己寫乙個日曆。打卡詳情 mounted console.log this.selyear,this.selectedmonthdate this.getcurmonthdata this.selectedmonthdate met...
如何做乙個專案
早上上csdn瞧瞧,發現有位同學想在暑期做個論壇,想要點建議,相信有不少已經入門想有所提高的同學都有這個想法。那麼我就在此提幾點意見,大家可以討論討論。首先選專案,我覺得這位同學拿論壇入手是比較合適的,原因有這樣幾點 1 論壇的基本業務邏輯大家都很熟悉2 量不是很大,可以在兩個月內完成基本功能的實現...
在專案中解決的乙個死鎖問題
描述 finance 系統 呼叫 process 系統的時候發生死鎖。用 show processlist 可以看到存在status是 updating 的程序,而該程序就是發生了死鎖的sql。分析 問題產生的原因是 finance 系統在事務a中update了一條資料,並且這條資料已被加行鎖 pr...