dom.getBoundingClientRect().height與dom.clientHeight
dom.getBoundingClientRect().height能獲取小數(shù)點級別的px像素焕刮，dom.clientHeight只能獲取到整數(shù)的實現(xiàn)h5的pdf文件預覽功能
- 下載pdf.js相關文件地址：http://mozilla.github.io/pdf.js/getting_started/#download
image.png - 引入文件到項目中
- 訪問地址： xxxx(域名)/pdf/web/viewer.html?file=encodeURIComponent(pdf地址)
- 通過
new URL()生成鏈接沸呐，語法文檔
new URL(
require('@img/start/sub_health_share.png'), // => 'start/sub_health_share.png'
location.href // =>https://aa.com.com/bb/cc/index.html
)
// => 得到URL實例
URL {
hash: ""
host: "aa.com.com"
hostname: "aa.com.com"
href: "https://aa.com.com/bb/cc/start/sub_health_share.png"
origin: "https://aa.com.com"
password: ""
pathname: "/bb/cc/start/sub_health_share.png"
port: ""
protocol: "https:"
search: ""
searchParams: URLSearchParams {}
username: ""
__proto__: URL
}
// ===================
new URL(
'start/sub_health_share.png',
location.href // =>https://aa.com.com/bb/cc/index.html
).href
// => https://aa.com.com/bb/cc/start/sub_health_share.png
new URL(
'/start/sub_health_share.png',
location.href // =>https://aa.com.com/bb/cc/index.html
).href
// => https://aa.com.com/start/sub_health_share.png
css屬性：white-space
屬性值：
normal 默認悼粮。空白會被瀏覽器忽略竹勉。
pre 空白會被瀏覽器保留。其行為方式類似 HTML 中的 <pre> 標簽篙顺。
nowrap 文本不會換行椿浓，文本會在在同一行上繼續(xù)，直到遇到
標簽為止幅骄。
pre-wrap 保留空白符序列劫窒，但是正常地進行換行。
pre-line 合并空白符序列拆座，但是保留換行符主巍。
inherit 規(guī)定應該從父元素繼承 white-space 屬性的值。
值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的挪凑≡兴鳎可以使用設置該屬性值使/n能夠換行。require一個node模塊什么時候需要加上.default岖赋？詳細解釋
babel@6及之后，不再把export default轉成node的module.exports瓮孙，而是module.exports.default唐断，所以在require的時候需要加上.default。通過引入babel-plugin-add-module-exports這個plugin可以解決這個問題杭抠。
// 方式1：在index.js中使用ES6的import方法導入方式
import router from './router'
//方式2：在index.js中使用CommonJS的模塊導入方式require引入router模塊脸甘，則需要使用 .default 來獲取實際的組件選項
const router = require('./routes').default;
圖片的pointer-events屬性
要留意圖片操作是否有設置pointer-events屬性，會禁用用戶行為偏灿，比如長按識別圖片二維碼丹诀，長按保存等微信h5長按識別二維碼
- 安卓表現(xiàn)，touchstart翁垂，彈出二維碼铆遭，不會執(zhí)行touchend事件，需要再點一下屏幕才會觸發(fā)touchend事件沿猜；
- ios無此問題枚荣，touchstart后執(zhí)行touchend
- 視頻自動播放hack
安卓可自動播放，ios則通過微信內(nèi)調(diào)動wx.getNetworkType()接口觸發(fā)用戶行為點擊后調(diào)用video.play().
wx.getNetworkType({
complete: () => {
video.play()
}
})
- 輸入法實現(xiàn)搜索按鈕
input的type="search"啼肩，安卓生效橄妆，ios中失效衙伶，需要在input外面增加一層form標簽.
<form class="form" action="javascript: void(0);" @submit.prevent>
<input
ref="input"
v-model="innerValue"
type="search"
/>
</form>
