WordPress 是否可以擴充套件 WP 自定義 JS 方法？

問題描述

我想知道是否可以擴充套件 wp-admin/js/customize-control.js 中匿名 api 物件的方法。我需要使用自己的自定義邏輯覆蓋這些方法之一，但我懷疑這是不可能的，因為它被包裹在一個立即被呼叫的函式表示式中：

/* globals _wpCustomizeHeader, _wpMediaViewsL10n */
(function( exports, $ ){
// code
})( wp, jQuery );

據我所見，我無法從視窗物件中擴充套件原型，因為它是匿名執行的，不能從 window.wp.customize 獲得。任何想法，如果這樣的事情是可能的？甚至提到在.toggle() 方法檔案/描述：https://github.com/WordPress/WordPress/blob/master/wp-admin/js/customize-controls.js#L110 中覆蓋這一點，但我不知道是否意味著透過簡單地分派整個 JS 檔案，將 WP 版本排隊並排隊自己，或者如果它們是或有些不同。

請注意，似乎應該可以使用 wp.customize.{method}.extend({ foo: // replace method foo here })，但這僅適用於公共基類/物件，而不適用於 wp-admin/js/customize-control.js

最佳解決方案

我會加強我對你的問題的小小評論。但再次提示; 我不是 JS 專家以下來源，提示僅用於使用 Customizer 進行不同的檢查，例如我的 sandbox 。

wp.customize

瞭解 WP 主題定製程式介面圍繞著理解 wp.customize JavaScript 物件。 wp.customize 物件很重要，您應該在開始時進行設定。

例項

以下小例子說明瞭這一點。起初我將 var api 設定為定製器的物件。之後，我將自定義欄位設定為 api，並使用小型 jQuery 源來增強這一點，以重新整理即時預覽的結果。

( function( $ ) {
    var api = wp.customize;

    // Site title and description.
    api( 'blogname', function( value ) {
        value.bind( function( to ) {
            $( '#header h1 a, #footer a.site-name' ).html( to );
        } );
    } );

    api( 'blogdescription', function( value ) {
        value.bind( function( to ) {
            $( '#header p.site-description' ).html( to );
        } );
    } );

} )( jQuery );

設定和控制元件

控制物件儲存在 wp.customize.control 中，設定物件儲存在 wp.customize 中。值班有很多功能，可以幫助你。

instance(id) – 從集合中獲取具有指定 ID 的物件。
has(id) – 如果集合包含具有指定 id 的物件，則返回 true，否則返回 false 。
add(id，value) – 使用指定的 id 和值將物件新增到集合。
remove(id) – 從集合中刪除物件。
create(id) – 使用預設建構函式建立一個新物件，並將其新增到集合中。
每個 (回撥，上下文) – 迭代集合中的元素。

自定義設定

透過這些功能，我們可以增強自定義設定。

var api = wp.customize,
    mysetting = api.instance( 'my_custom_setting' );

也可用於陣列

var api = wp.customize,
    mysetting = api.instance( 'my_custom_settings[my_custom_setting_field]' );

Get

在控制檯中檢視結果。

console.log( api.instance( 'my_custom_settings[my_custom_setting_field]' ).get() );

Set

您還可以透過功能 set 更改設定值。

api.instance( 'my_custom_settings[my_custom_setting_field]' ).set( 'my new value' ) );

獲取控制元件，作為物件

console.log( api.control.instance( 'my_custom_setting_field' ) );

有用的來源

wp-admin /JS /customize-controls.js
wp-includes /JS /customize-preview.js
wp-includes /JS /customize-base.js

參考文獻

Is it Possible to Extend WP Customize JS Methods?

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

WordPress 是否可以擴充套件 WP 自定義 JS 方法？