第十章：小程序表單與醫療急救卡（下）
作者：知曉雲 - 小程序開發快人一步 來源：知曉課堂 在上一節，我們瞭解了許多表單組件的用法。在這一節，我們將會繼續對小程序進行開發。 特殊功能開發 小程序請求呼出電話 添加輸入框 input 組件和按鈕 button 組件，用以輸入緊急聯繫人電話號碼和點擊 button 撥打號碼 `!--pages/index/index.wxml-- view view緊急聯繫人電話號碼：/
昵稱 知曉雲
@前端
貢獻者508
粉絲0
貢獻者
@前端
動態 列表
開發一個 App Clip 並不難！我們立馬上開發教程
作者｜何世友、彭權華 在 2020 年 6 月 23 日的 WWDC 大會中，蘋果發佈了 App Clips 。 App Clip（官方翻譯：輕 App；民間翻譯：「蘋果」小程序），是主 app 輕量級的版本，旨在在特定場景為用户提供快速便捷的體驗。 如果你在上班路上經過一家咖啡店想購買一杯咖啡，但發現排隊下單付款的人很多，此刻你只需要使用 iPhone 自帶的掃碼工具掃描咖啡商店的 App Cl
昵稱 知曉雲
小程序或移動端『滾動穿透』與『滾動溢出』解決方案
滾動穿透 問題描述 在移動端 WEB 開發的時候（小程序也雷同），如上錄屏所示，如果頁面超過一屏高度出現滾動條時，在 fixed 定位的彈窗遮罩層上進行滑動，它下面的內容也會跟着一起滾動，看起來好像事件穿透到下面的DOM元素上一樣，我們姑且稱之為滾動穿透。 問題原因 能夠猜想是文檔（document）的滾動事件被觸發了，如果能禁用滾動事件就好辦了。 案例偽代碼 div class="btn"點擊
昵稱 Barrior
保姆級教程：寫出自己的移動應用和小程序（篇六）
上期文章我們學習瞭如何寫出小程序的樣式內容。今天我們來看一下如何在小程序中使用 js ，即在小程序中使用腳本內容處理內容或樣式的改變。 小程序中的 JS 是如何跟 WXML 以及 WXSS 關聯起來的：組織方式關聯 以這個 view 頁面為例，在小程序代碼的組織方式中， WXML, WXSS 以及 JS 的文件名必須是命名一致的，否則將會產生錯誤。如下： 為了方便講解，我們直接使用了微信開發者工具
昵稱 火爆的茶壺
今天聊：2~4 年前端走出離職困境與舒適區
本文寫於 2019 年，原鏈接 404 了，重新發布同步於此。1 萬個小時和 3 萬行代碼，會成為工作前 4 年非常核心的量化指標，把握住這段週期，可以在職場建立非常有競爭力的擇業優勢，更關鍵的是自己真正的潛能會被挖掘出來，繼而有機會成為那個心目中的大牛，而把握二字，知易行難，背後需要不斷的走出舒適區，不斷的突破困境區，需要你的決心和勇氣。我是一個做了10 年前端、堅信創業是場修行的趕路人，如果你
昵稱 前端早早聊
你想要的【微前端】都在這裏了！ | 京東雲技術團隊
作者：京東零售 鄭炳懿 開篇： 如果你不知道微前端是什麼，或者不知道微前端能解決什麼問題，那麼你可能不需要微前端。 在我看來，對於每一個沒有使用過的新技術，都應該有以下幾個過程： 1、調研該技術，產出相應的調研文檔。 2、輸出技術Demo，基本的框架結構。 3、試着在項目中使用它，這一步坑會很多。 4、把它推動到線上完成真正的技術升級。 一、調研微前端 1.1 業務背景 某次遇到一個從0到1的大型
昵稱 京東雲開發者
什麼是 JSON？全面解析JSON
現在程序員還有誰不知道 JSON 嗎？無論對於前端還是後端，JSON 都是一種常見的數據格式。那麼 JSON 到底是什麼呢？ JSON 的定義 JSON （JavaScript Object Notation） ，是一種輕量級的數據交換格式。它的使用範圍很廣，併成為 ECMA 標準，可以被使用在多種編程語言中，用於前後端之間的數據傳輸、存儲和交換數據。可以説是“用更少的編碼，有更快的處理速度”，所
昵稱 倔強的鉛筆
前端有未來嗎？
最近一段時間，通過各種方式與同行們交流了「前端技術」與「前端工程師」的現狀及未來發展的方向性問題，大家在一些方面有所共鳴。 下面就來説説我的一些看法—— 困惑 多多少少，有人曾經或正在困惑：「前端有未來嗎？」 有此困惑的人，TA 可能是—— 正在學習 web 前端技術，就是純粹的 HTML、CSS 和 JS，在用這幾樣做網頁。練習的過程中發現，或者説突然想到：「現在微信小程序風行，在其與原生客户端
昵稱 歐雷
深入探討Node.js文件寫入：逐步教程
文件寫入是 Node.js 中的一項重要任務，它允許你將數據保存到本地文件系統中，供後續使用。這個功能在許多應用中都有廣泛的應用，包括數據備份、日誌記錄、配置文件更新等。在本文，我們將介紹如何在 Node.js 中執行文件寫入操作，提供基本概念、常用方法、使用場景和實踐案例。 基本概念 在開始之前，讓我們先了解一些基本概念。 文件系統模塊 Node.js 提供了內置的文件系統模塊 fs，它包含了
昵稱 倔強的鉛筆
一個讓vue開發效率翻倍的小工具
分享一個很實用的工具庫 VueUse，它是基於 Vue Composition Api，也就是組合式API。支持在Vue2和Vue3項目中進行使用，據説是目前世界上Star最高的同類型庫之一。 它的初衷就是將一切原本並不支持響應式的 JS API 變得支持響應式，省去程序員自己寫相關代碼。 官方地址：https://vueuse.org/ 中文地址：https://www.vueusej
昵稱 Winn
精通軟件質量提升的利器：Mock 測試教程
在軟件工程的套路中，虛擬化測試，又稱 Mock 測試，扮演一個無可或缺的角色。Mock 測試允許工程師仿製和操控對象、服務或者系統組件等的行為，使得人們能在一個乾淨獨立的環境裏測試特定功能。這種方法能確保測試聚焦於代碼邏輯，而非外圍干擾因素。 Mock 測試的核心概念 Mock 測試 用虛擬對象取代實際對象，通過控制外部依賴，帶來了測試的隔離性和準確性，從而確立了代碼的穩定性及其長期維護性。 Mo
昵稱 Apifox
提高開發效率：Mock.js 數據模擬實戰教程
在本篇文章中，我們將深入探討Mock.js，這是一款在前端開發中廣泛應用的工具庫，專門用於生成模擬數據和攔截 Ajax 請求。本文將從以下幾個角度展開討論 Mock.js 的功能和應用： 如何開始使用 Mock.js 創建模擬數據 應用數據模板 模擬 Ajax 請求的技巧 開始使用 Mock.js 首要步驟是將 Mock.js 集成到你的項目中，這可以通過下面的 npm 命令來完成：
昵稱 Apifox
掌握 Vue3 中的 setup 函數
Vue.js 經歷了從 Vue 2 到 Vue 3 的重大變革，帶來了許多引人注目的新特性和性能優化。其中，setup函數無疑是最引人矚目的新星之一。 一、概覽 setup函數是 Vue 3 引入的一個新的組件選項，作為組合式 API 中心，它允許開發者在一個空間內使用所有的 composition API。這個函數將在組件創建之前執行，這樣就為你提供了定義響應式變量、計算屬性、函數等的機會，從而
昵稱 Apifox
從2024看2025前端發展趨勢
前言 又至年關，回顧整個2024年，前端行業仍舊百廢待興，IT業界同樣也未見有所起色，AI風潮也從狂熱興奮逐步走向了冷靜穩定階段，造成此形勢感觀並非單一行業或者某一企業之特例，實為政經等綜合影響之結果。因此，私以為明年的大趨勢和調性應該不會有特別大的變化，雖然外界走向有所放緩，但整個情勢壓力還是不小的。故而，就前端行業而言，個人認為我們能做到的大概有以下幾個方面。 泛化 正如前序所言，相較於前幾
昵稱 維李設論
再談愚蠢的「八股文」面試
今天，在文章《純「牛馬」的邏輯玩兒不轉了！》開頭提到的那個微信羣中，看到有人發了張圖片： 正如上面提到的文章中所「噴」的那樣，以「八股文」為主的技術一面根本沒有存在的必要，彰顯出那些用人單位對招聘方法的不思進取。 他們的不思進取，一方面導致自己有較高的招聘成本，找到合適的人的效率十分低下；另一方面，也促使應聘者不思進取，不注重自己平時的積累沉澱，靠臨時抱佛腳來謀求一個工作機會。 我推崇工匠精神，
昵稱 歐雷
抖音私信卡片源碼，揭秘抖音私信卡片生成的源碼和技術原理
摘要 抖音卡片是如何生成的？其實抖音是直接抓取html頁面的一些信息來生成封面圖、主標題、副標題的。 代碼 !DOCTYPE html html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" head meta http-equiv="Content-Type" content="text/html; charset=utf-
昵稱 TANKING
MetisUI-一套企業級 React-Tailwind 組件庫
Metis UI 的目標是為那些喜歡 Ant Design 的開發者提供一個更靈活的選擇，特別是希望結合 Tailwind CSS 的開發者。我們在保留 Ant Design 組件設計邏輯的基礎上，提供了以下改進： 樣式覆蓋更靈活基於 Tailwind CSS 的樣式體系，開發者可以方便地對組件的各個元素進行樣式覆蓋，無需編寫複雜的自定義樣式，快速實現個性化設計。 增強的交互功能內置了一些
昵稱 Ming
樹形選擇器的使用場景探索
在工作中，樹形選擇器（tree-select）是一種常見的基礎組件, 這次我們針對此組件做一些業務適配 背景: 在一個大型組織（2 萬以上）內，需要有一個選擇人、組的一個選擇器, 支持搜索功能。 一開始我的思路是這樣： 層級加載+後端搜索 **既然數據量很多，那最好不要一次性加載，不然會有以下的一些問題： 問題一是後端的加載速度很慢 二是前端也會手動很大的影響，比如需要開
昵稱 Grewer
為什麼説低代碼謊言的破滅，是AI原生開發的起點？
幾年前，公司老闆、產品經理，甚至隔壁行政的同事，都拿着一份花裏胡哨的低代碼方案，眼睛放光地跟你説：“小張啊，你來看看，未來！拖拉拽就能上線，咱們再也不用養那麼多程序員了！” 我當時啥心情？表面上“嗯嗯嗯，是是是，很有前景”，心裏一萬頭羊駝在奔騰。你懂個錘子啊，我一直認為它是解決了一類問題，引入了一大堆的複雜。 這玩意兒的核心是啥？説白了，就是想用一套“萬能模板”去解決所有問題。聽着是挺美，但咱都是
昵稱 悲傷的煎雞蛋_cQXuXF
【原理揭秘】Vite 是怎麼兼容老舊瀏覽器的？你以為僅僅依靠 Babel？
作者：京東科技 孫凱 一、前言 對前端開發者來説，Vite 應該不算陌生了，它是一款基於 nobundle 和 bundleless 思想誕生的前端開發與構建工具，官網對它的概括和期待只有一句話：“下一代的前端工具鏈”。 Vite 最早的版本由尤雨溪發佈於3年前，經歷了3年多的發展，Vite 也已逐漸迭代成熟，它的穩定性、擴展性、周邊生態足以在生產環境中支撐各種業務場景的落地。但是關於Vite的
昵稱 京東雲開發者
jest +ts +esm
Jest 是當下最主流的前端測試框架 首先初始化ts環境 yarn add typescript --dev npx tsc --init 第二步:安裝ts下的jest yarn add jest @types/jest --dev 第三步:新建tests文件夾 tests/index.spec.ts it('init',()={ expect(true).toB
昵稱 ohoherror
帶你揭開神秘的Javascript AST面紗之Babel AST 四件套的使用方法
作者：京東零售 周明亮 寫在前面 這裏我們初步提到了一些基礎概念和應用： 分析器 抽象語法樹 AST AST 在 JS 中的用途 AST 的應用實踐 有了初步的認識，還有常規的代碼改造應用實踐，現在我們來詳細説説使用 AST， 如何進行代碼改造？ Babel AST 四件套的使用方法 其實在解析 AST 這個工具上，有很多可以使用，上文我們已經提到過了。對於 JS 的 AST 大家已經
昵稱 京東雲開發者
偏愛console.log的你，肯定會覺得這個插件泰褲辣！
前言 毋庸置疑，要説前端調試代碼用的最多的，肯定是console.log，雖然我現在 debugger 用的比較多，但對於生產環境、小程序真機調試，還是需要用到 log 來查看變量值，比如我下午遇到個場景：選擇完客户後返回頁面，根據條件判斷是否彈窗： if (global.isXXX || !this.customerId || !this.skuList.length) return // 到
昵稱 暴走
從Babel開始認識AST抽象語法樹
前言 AST抽象語法樹想必大家都有聽過這個概念，但是不是隻停留在聽過這個層面呢。其實它對於編程來講是一個非常重要的概念，當然也包括前端，在很多地方都能看見AST抽象語法樹的影子，其中不乏有vue、react、babel、webpack、typeScript、eslint等。簡單來説但凡需要編譯的地方你基本都能發現AST的存在。 babel是用來將javascript高級語法編譯成瀏覽器能夠執行的語
昵稱 南玖