feat(search): Localization for search placeholder, close #80

Author: QingWei-Li

docs/plugins.md

@@ -89,6 +89,10 @@ window.$docsify = {
       // ...
     })
 
+    hook.mounted(function() {
+      // Called after initial completion. Only trigger once, no arguments.
+    })
+
     hook.ready(function() {
       // Called after initial completion, no arguments.
     })

docs/zh-cn/plugins.md

@@ -84,6 +84,10 @@ window.$docsify = {
       // ...
     })
 
+    hook.mounted(function() {
+      // 初始化完成后调用 ，只调用一次，没有参数。
+    })
+
     hook.ready(function() {
       // 初始化并第一次加完成数据后调用，没有参数。
     })

src/core/init/index.js

@@ -18,6 +18,7 @@ export function initMixin (proto) {
     initEvent(vm) // Bind events
     initRoute(vm) // Add hashchange eventListener
     initFetch(vm) // Fetch data
+    callHook(vm, 'mounted')
   }
 }
 

src/core/init/lifecycle.js

@@ -1,7 +1,14 @@
 import { noop } from '../util/core'
 
 export function initLifecycle (vm) {
-  const hooks = ['init', 'beforeEach', 'afterEach', 'doneEach', 'ready']
+  const hooks = [
+    'init',
+    'mounted',
+    'beforeEach',
+    'afterEach',
+    'doneEach',
+    'ready'
+  ]
 
   vm._hooks = {}
   vm._lifecycle = {}

src/plugins/search/component.js

@@ -67,7 +67,7 @@ function style () {
 
 function tpl (opts) {
   const html =
-    `<input type="search" placeholder="${opts.placeholder}" />` +
+    `<input type="search" />` +
       '<div class="results-panel"></div>' +
     '</div>'
   const el = dom.create('div', html)
@@ -108,9 +108,25 @@ function bindEvents () {
   })
 }
 
-export default function (opts) {
+function updatePlaceholder (text, path) {
+  const $input = dom.getNode('.search input[type="search"]')
+
+  if (typeof text === 'string') {
+    $input.placeholder = text
+  } else {
+    const match = Object.keys(text).find(key => path.indexOf(key) > -1)
+    $input.placeholder = text[match]
+  }
+}
+
+export function init (opts) {
   dom = Docsify.dom
   style()
   tpl(opts)
   bindEvents()
 }
+
+export function update (opts, vm) {
+  updatePlaceholder(opts.placeholder, vm.route.path)
+}
+

src/plugins/search/index.js

@@ -1,4 +1,4 @@
-import initComponet from './component'
+import { init as initComponet, update as updateComponent } from './component'
 import { init as initSearch } from './search'
 
 const CONFIG = {
@@ -21,11 +21,14 @@ const install = function (hook, vm) {
 
   const isAuto = CONFIG.paths === 'auto'
 
-  hook.ready(_ => {
+  hook.mounted(_ => {
     initComponet(CONFIG)
     isAuto && initSearch(CONFIG, vm)
   })
-  !isAuto && hook.doneEach(_ => initSearch(CONFIG, vm))
+  hook.doneEach(_ => {
+    updateComponent(CONFIG, vm)
+    !isAuto && initSearch(CONFIG, vm)
+  })
 }
 
 window.$docsify.plugins = [].concat(install, window.$docsify.plugins)