微信小程序關(guān)鍵字變色實現(xiàn)代碼實例
更新時間：2019年12月13日 08:30:43 作者：星光筆
這篇文章主要介紹了微信小程序關(guān)鍵字變色實現(xiàn)代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
這篇文章主要介紹了微信小程序關(guān)鍵字變色實現(xiàn)代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
1.小程序中不支持渲染indexOf使用，我們可以通過新建wps來實現(xiàn)
function fn(arr, arg) {
var result = {
indexOf: false,
toString: ''
}
result.indexOf = arr.indexOf(arg) > -1;
result.toString = arr.join(","); return result;
}
module.exports.fn = fn;
2.index.wxml
<wxs src="../indexOf.wxs" module="tools" />
<!-- tools可以自定義 -->
<view class="intro" >
<block wx:for="{微信小程序,關(guān)鍵字,變色}">
<text class=" {{tools.fn(ckey, item).indexOf?'active':'black'}}">{{item}}</text>
</block>
</view>
引入我們的wxs，module可以自己定義，下面模板渲染中可以使用
3.index.js
const app = getApp()
Page({
data: {
keywords:['我','愛','你'],
ckey:['我','愛']
},
onLoad: function () {
console.log('代碼片段是一種迷你、可分享的小程序或小游戲項目，可用于分享小程序和小游戲的開發(fā)經(jīng)驗、展示組件和 API 的使用、復(fù)現(xiàn)開發(fā)問題和 Bug 等?？牲c擊以下鏈接查看代碼片段的詳細文檔：')
console.log('https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/devtools.html')
},
})
小程序代碼塊鏈接：https://developers.weixin.qq.com/s/vmdBhXmA7acA
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
組合模式大概是設(shè)計模式里面使用最為廣泛的模式之一了，模式本身理解起來也比較簡單，以至于可以毫不費力的寫出一個能用的組合模式偽代碼2016-08-08
在服務(wù)器端的單元測試中，都有各種各樣的測試框架，在JavaScript中現(xiàn)在也有一些很優(yōu)秀的框架，但在本文中，我們將自己動手一步步來實現(xiàn)一個簡單的單元測試框架2012-04-04
JavaScript實現(xiàn)的鼠標響應(yīng)顏色漸變效果完整實例
這篇文章主要介紹了JavaScript實現(xiàn)的鼠標響應(yīng)顏色漸變效果,涉及javascript面向?qū)ο蠹笆录O(jiān)聽、響應(yīng)機制相關(guān)操作技巧,需要的朋友可以參考下2017-02-02
這篇文章主要介紹了JavaScript插件化開發(fā)教程，十分的詳細，2015-01-01
這篇文章主要給大家介紹了關(guān)于微信小程序js時間戳與日期格式的轉(zhuǎn)換方法,在小程序中使用時間選擇器時,獲取到的時間可能是一個時間戳,這并不是我們想要的,這時候我們得將獲取到的時間戳進行轉(zhuǎn)換,需要的朋友可以參考下2023-10-10
這篇文章主要介紹了NestJs 靜態(tài)目錄配置，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
Javascript判斷文件是否存在(客戶端/服務(wù)器端)
這篇文章主要介紹了Javascript判斷文件是否存在的方法適用于客戶端、服務(wù)器端，遠程文件，示例代碼如下,需要的朋友可以參考下2014-09-09
作為一項有意思的新技術(shù)，canvas給我們帶來了對網(wǎng)頁繪圖和網(wǎng)頁動畫的新革命。本文簡單介紹下canvas實用的功能，下面跟著小編一起來看下吧2017-01-01
這篇文章主要介紹了分析ES5和ES6的apply區(qū)別，對ES6感興趣的同學(xué)，可以參考下2021-05-05
這篇文章主要介紹了使用swiper自定義分頁點擊跳轉(zhuǎn)指定頁面方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04