項目下有.htaccess文件，里面配置了路由規則，如下：

<IfModule mod_rewrite.c>
   RewriteEngine On
   RewriteCond %{REQUEST_FILENAME} !-d
   RewriteCond %{REQUEST_FILENAME} !-f
   RewriteRule ^(.*)$ index.php?url=$1 [QSA,L]
</IfModule>

升級前訪問域名（不帶路徑，比如http://www.juyunmall.com）會正確進入系統。

但在升級后，訪問域名卻把項目里面的文件列出來了（Options All），并沒有按規則進入index.php文件。

排查下來的原因是新版本apache，在訪問域名（不帶路徑，比如http://www.juyunmall.com）時RewriteCond %{REQUEST_FILENAME} !-d 這個條件是不成立的，導致沒有進入RewriteRule，猜測新版本把只訪問域名也當做對是對工作目錄對直接訪問了？

解決辦法，針對只訪問域名的情況再加上一個規則RewriteRule ^$ index.php [QSA,L]，變成如下：

<IfModule mod_rewrite.c>
   RewriteEngine On
   RewriteRule ^$ index.php [QSA,L]
   RewriteCond %{REQUEST_FILENAME} !-d
   RewriteCond %{REQUEST_FILENAME} !-f
   RewriteRule ^(.*)$ index.php?url=$1 [QSA,L]
</IfModule>

近期，東北、華北、黃淮等地出現極端降雨，多地出現居民被困和人員傷亡情況，全國各地救援力量迅速集結，馳援防線救災一線，全力投入防汛救災工作。在當前全國齊心聚力、攜手救災的特殊時期，個別網民編造傳播涉災情虛假信息、挑動地域對立歧視，嚴重擾亂網上輿論秩序，干擾妨礙抗險救災工作。為進一步凈化網絡環境，維護網絡秩序，全力維護全國上下萬眾一心、全力救災恢復、全力保障人民群眾生命財產安全和社會大局穩定的網上主旋律，切實成為防汛救災的參與者、助力者，現發出如下倡議:

一、自覺抵制違法有害信息網上傳播
1、堅決抵制違法有害信息。不制造、不聽信、不傳播涉災救災違法有害和負面不良信息，不以訛傳訛，不煽風點火，不隨意傳播無出處、無證據的舉報、泄露隱私、個人攻擊、不良言論等內容。
2、嚴管信息發布賬號。強化對賬號信息的人工審核和資質認證，嚴防假冒仿冒黨政軍機關、新聞媒體、地方政府和用戶賬號，嚴控不符合資質認證要求并從事專門領域信息內容生產的“自媒體”賬號，嚴禁操縱“自媒體”賬號矩陣發布傳播涉災救災違法和負面不良信息
3、嚴管信息發布內容。用戶發布新聞信息，要按照有關規定標注信息來源，自行拍攝信息，要逐一標注拍攝時間地點;使用技術生成信息，要打上技術生成標簽;引用舊聞舊事的，要說明事發時間地點; 發布含有虛構演繹內容信息，要加注虛構演繹標簽; 平臺對存疑或謠言信息，將標記爭議謠言標簽，并按規定采取限流、辟謠、禁言等處置措施。

二、堅持對違法有害信息“零容忍”
4、增強網絡文明意識。樹立正確的網絡道德觀，主動抵制和舉報各種網上違法犯罪和低俗不良行為，堅決同網絡違法犯罪活動作斗爭，全力維護國家、社會、集體和個人的合法權益。
5、強化輿論正面引導。通過平臺公約、用戶協議完善對粉絲數量和營利權限的管理措施，對違法違規賬號，將視情采取關閉禁言或者限制、禁止新增粉絲以及清空全量粉絲等懲戒措施;對多賬號聯動蹭炒防汛救災熱點話題、敏感事件進行惡意營銷的用戶賬號，將取消或嚴禁賦予營利權限。
6、積極營造健康網絡輿論生態。對“自媒體”賬號，將顯著標明所屬 MCN機構，對利用簽約賬號聯動炒作、多次出現違規行為的 MCN 機構，將采取限制營利權限、限制提供服務、入駐清退等處置措施。

三、積極發動發揮網絡平臺的正能量
7、建立健全監督舉報。鼓勵用戶參與平臺信息內容管理，收集并舉報違法有害信息，發現并揭批謠言和虛假信息主動向監管部門提供相關線索，并配合調查和處理，最大限度消除負面影響。
8、積極協助求助求救。主動搜集群眾網上求助求救線索，及時報告有關主管部門，并在當地黨委政府的統籌指揮下，配合有關部門全力開展救災救援工作。
9、堅決曝光違法犯罪案例。大力加強違法違規用戶處置和賬號曝光力度，開設警示教育專欄，定期發布違法違規用戶典型案例，提醒警示用戶嚴格遵守國家法律法規，嚴格履行平臺公約和服務協議，加強自律自治；

轉載注明：http://bbs.0550.com/t-1435939-1-1.html；

注冊全局組件

2.0：

Vue.component('UITreeBase', UITreeBase)

3.0：

const app = createApp(App)
// 作為全局組件避免交叉引用
app.component('UITreeBase', UITreeBase)

Vuex

import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
  modules: {
    design,
    user
  }
})

3.0:

import { createStore } from 'vuex'
export default createStore({
  modules: {
    design,
    user
  }
})

computed中的mapState

import { mapState } from 'vuex'
computed: {
  …mapState({
    sideBars: (state: any) => state.design.leftSidebars,
    leftSidebarMinWidth: (state: any) => state.design.leftSidebarMinWidth,
    pageScale: (state: any) => state.design.scale
  })
}

3.0

const leftSidebarMinWidth = computed((ctx: any) => ctx.$store.state.design.leftSidebarMinWidth)
const leftSidebarWidth = computed({
get () {
return this.$store.state.design.leftSidebarWidth
},
set (v: number) {
this.$store.commit('updateState', { leftSidebarWidth: v })
}
})

setup中的this

import { ref, reactive, computed, watch, onMounted, getCurrentInstance } from 'vue'
const { ctx } = getCurrentInstance()

store

2.0 調用store是直接通過this.$store.commit/dispatch

3.0

import { useStore } from 'vuex'
const store = useStore()
store.commit('updateState', { rightSidebarIsOpen: v })

如果是要使用$store的話，需要在src目錄下面創建一個shims-vux.d.ts文件，內容如下

import { Store } from 'vuex'
import { State } from './store'

declare module '@vue/runtime-core' {
  interface ComponentCustomProperties {
    $store: Store<State>
  }
}



// Vuex@4.0.0-beta.1 is missing the typing for `useStore`. See https://github.com/vuejs/vuex/issues/1736

declare module 'vuex' {
  export function useStore(key?: string): Store<State>
}

注意：.$store用法雖然能編譯通過，但似乎并不能想期望的2.0那樣工作；useStore()在setup里面調用，如果在方法里面調用，或則在computed的get，set里面調用useStore()返回的是undefined

$refs

2.0 直接用this.$refs.XXX引用

3.0 直接需要const refName = ref(), 然后setup中返回refName即可，refName就是ref=“refName”中的名字

$nextTick

import { nextTick } from 'vue'

Vue.component

2.x 動態注冊組件

Vue.component(
  name,
  (resolve) => {
    // console.log(`@/components/ui/${this.ui}_${this.uiVersion}/${this.uiconfig.type}.vue`)
    require([`@/components/ui/${this.ui}_${this.uiVersion}/${this.uiconfig.type}.vue`], resolve)
  }
)

Vue.config.productionTip

3.x 已刪除該選項

Write operation failed: computed value is readonly

這個警告有幾種情況：

1. 對應computed沒有定義set, 定義對應的set即可
2. store中使用了[]語法，比如state[name] = value：