Skip to content

Latest commit

 

History

History
204 lines (127 loc) · 4.04 KB

plugin_properties_methods.md

File metadata and controls

204 lines (127 loc) · 4.04 KB

Buitin Plugin: Properties & Methods

Some built-in plugins will export some public methods for special needs, E.g:

vConsole.log.info()

If a plugin is not added, its instance and methods will be undefined, E.g:

vConsole = new VConsole({ defaultPlugins: ['system'] }); // network plugin is not added
vConsole.network.clear(); // Error: network is undefined

Log Panel

vConsole.log.log()

The same as console.log() series method. All available methods:

vConsole.log.log(...)
vConsole.log.info(...)
vConsole.log.debug(...)
vConsole.log.warn(...)
vConsole.log.error(...)

By calling this method, logs will only be output to vConsole Log panel instead of browser console.

vConsole.log.clear()

Remove all logs of Log panel. Similar to console.clear().

Parameters

None.

Return value

void

System Panel

vConsole.system.log() | info() | debug() | warn() | error()

The same as vConsole.log.log(), but the logs will be output to System panel.

vConsole.system.clear()

Remove all logs of System panel.

Parameters

None.

Return value

void

Network Panel

vConsole.network.add()

Add a custom request to Network panel.

vConsole.network.add(item: VConsoleNetworkRequestItem): VConsoleNetworkRequestItemProxy

Parameters

  • item: VConsoleNetworkRequestItem: The custom request object.
interface VConsoleNetworkRequestItem {
  // HTTP method
  method: '' | 'GET' | 'POST' | 'PUT' | 'DELETE' | 'HEAD' | 'CONNECT' | 'OPTIONS' | 'TRACE' | 'PATCH';
  // Full URL, E.g: https://www.abc.com/foo?a=b
  url: string;
  // HTTP status code, E.g: 200
  status: number | string;
  // XMLHttpRequest.readyState
  readyState?: XMLHttpRequest['readyState'];
  // Response header, key-value pairs
  header: { [key: string]: string };
  // XMLHttpRequest.responseType
  responseType?: XMLHttpRequest['responseType'];
  // 'xhr': XMLHttpRequest, 'custom': custom request
  requestType: 'xhr' | 'fetch' | 'ping' | 'custom';
  // Correspond `XMLHttpRequest.setRequestHeader()` or fetch's headers
  requestHeader?: HeadersInit;
  // The body of response
  response: any;
  // Timestamp
  startTime: number;
  // Timestamp
  endTime: number;
  // Query string parameters, key-value pairs or JSON string
  getData?: { [key: string]: string } | null;
  // Request payload, key-value pairs or JSON string
  postData?: { [key: string]: string } | string | null;
}

Return value

VConsoleNetworkRequestItemProxy

Once a custom request is added, a new object pointing to this request will be returned.

The properties of the return object is extended by VConsoleNetworkRequestItem.

interface VConsoleNetworkRequestItemProxy extends VConsoleNetworkRequestItem {
  // The internal id of the request
  id: string;
  // If possible, response will be parsed to JSON string, otherwise original value
  response: string | any;
  // endTime - startTime
  costTime?: number;
}

vConsole.network.update()

Update a custom request.

vConsole.network.update(id: string, item: VConsoleNetworkRequestItem | VConsoleNetworkRequestItemProxy)

Parameters

  • id: string: The internal id of the custom request. Can get it in the return value of vConsole.network.add().
  • item: VConsoleNetworkRequestItem | VConsoleNetworkRequestItemProxy: The custom request object.

Return value

void

Notice:

Modify the properties of VConsoleNetworkRequestItemProxy.response will not work.
If you want to update response, you must re-assign the entire object.

const item = vConsole.network.add({
  response: { foo: 'bar' },
  ... // other request properties
});

item.response.foo = 'newbar'; // will not work, response will not be changed
item.response = { foo: 'newbar' }; // it works
vConsole.network.update(item.id, item);

vConsole.network.clear()

Remove all requests from Network panel.

Parameters

None.

Return value

void