文章

Safari 出現 SyntaxError: Invalid regular expression: invalid group specifier name

,

專案中如果有使用到正則表示，在Safari瀏覽器會在某個正則規則下，無法解析出來，就會出現 SyntaxError: Invalid regular expression: invalid group specifier name 的錯誤，然後整個網頁就會空白。

閱讀更多
/0 評論/通過：

如何讓fetch也可以有timeout效果

,

最近在公司接到一個小小的react native案子，整個app只有兩頁，之前使用vue做網頁平台的時候，與後端請求溝通都是使用axios這個套件，有很多的config參數可以設定，裡面就包含了請求逾時timeout。

可是我並不想只為了這些十支以內的api去裝axios套件，所以打算自己用fetch寫一個api底層，當然fetch最大的問題就在於：他沒有timeout這種參數給你設定。

要是你網路不穩，他就會一直等啊等啊等啊～

上網找了一堆資料，其中有些人提出用Promise.race方法，概念是：在race陣列中放入兩個function，一個是call api的fetch，另一個是單純的setTimeout，要是setTimeout先完成，就表示逾時拉～

但是在繼續查又看到google大大有提出超完美解法：原文在這裡

閱讀更多
/0 評論/通過：

秒數換算mm:ss

方法1：

const paddingZeroLeft = (str, length) => {
    if(typeof (str) !== "string"){
        str = str + "";
    }
    if (str.length >= length){
        return str;
    } else {
        return paddingZeroLeft("0" + str, length);
    }
};
let second = 300;
let mm = paddingZeroLeft(parseInt(vm.refreshCount / 60), 2);
let ss = paddingZeroLeft(parseInt(vm.refreshCount % 60), 2);
let text = '';
text = `0${mm}:${ss}`;
// 05:00

方法2：

引入moment.js

let second = 300;
let text = moment.utc(moment.duration(second, "s").asMilliseconds()).format("HH:mm:ss") || "-";
/0 評論/通過：

在vue cli3 專案中使用lodash

, 
import _ from "lodash";

先在會使用到的組件內引入lodash

methods: {
    func(){
        let lodashFunc = _.debounce(this.innerFunc(),1000);
   
        lodashFunc();
    },
    
    innerFunc(){
        console.log('dddd);
    }
}
/0 評論/通過：

在vue專案中讀取package.json資料

,

先在vue.config.js中加入plugin定義

module.exports = { 
  chainWebpack: config => {
    config.plugin("define").tap(definitions => {
      definitions[0]["process.env"]["PACKAGE_VERSION"] = JSON.stringify(
        require("./package.json").version,
      );
      return definitions;
    });
  },
};

讀取

let version = process.env.PACKAGE_VERSION;
/0 評論/通過：

在vue中使用setTimeout與setInterval

,

在vue中啟用、清除timeout的寫法不同，如果clearInterval沒有加上window，就不會停止。

setTimeout可以直接使用：

this.timeout = setTimeout(() => {
    console.log('一小時後要做的事');
}, 1000 * 60 * 60);
clearTimeout(this.timeout);
閱讀更多
/0 評論/通過：

React Native 使用 alias，不用寫很多相對路徑。

,

在React Native 版本0.61.5 ，使用 npx react-native init 建立的專案，自動會幫你安裝 metro-react-native-babel-preset ，並且產生 babel.config.js 這隻檔案
所以只需額外安裝 babel-plugin-module-resolver

$ yarn add babel-plugin-module-resolver -D
閱讀更多
/0 評論/通過：

‘React/RCTBridge.h’ file not found

  1. In Xcode, go to the project scheme (Product -> Scheme -> Manage Scheme -> double click your project).
  2. Click on the ‘Build’ option at the left pane.
  3. Uncheck ‘Parallelize Build’ under Build Options.
  4. Then in Targets section, click ‘+’ button then search for ‘React’. Select it and click ‘Add’. ‘React’ should now appear under
  5. Targets section. Click and drag it to the top so that it will be the first item in the list (before your project).
  6. Clean the project and build.
/0 評論/通過：