Skip to content

HBuilder X code prompt for wu-ui

wu-ui has been adapted to HX's code prompt function, allowing users to use wu-ui's components more easily and freely. This prompt function has the following features:

  • By typing the <wu keyword (without the need for the - following the <wu -), HX will list all components of the wu ui through a pop-up prompt
  • You can directly access the official document of the corresponding component with one click in the prompt
  • The prompt includes complete parameter types, optional parameter values, descriptions, event descriptions, and other prompts
  • You don't need to install plugins and settings for HX to have the above prompt function ###Trigger prompt In the template writing area of the "*. vue" file, by using the keyword starting with <wu, the candidate list of components for wu-ui can be triggered: If you want a more accurate prompt, you can type the component name in its entirety, such as<u buttonwhich will pop up a unique prompt. At this point, you can enter to type. If you cannot remember the name of a certain component clearly, you can use approximate character input. HX will match possible component options through fuzzy search, such aswu-alert-tips component. We can type <wu-alt, <wu-tips, or <wu-al, etc. to recognize the component prompt. Overall, starting with<wu, followed by some keywords of the component, the front, middle, and back parts are all available, and you can try it yourself. Trigger Demo

One click to open the corresponding document of the component in the browser

When we match a component in HX, the document address of the component will pop up below the Tooltip. Click the mouse to quickly open the corresponding document in the browser. Trigger Demo

Parameter prompt

  1. After entering the complete component structure, we can list the parameters of the component by starting with:, and there are corresponding types and descriptions prompts on the right. Trigger Demo
  2. You can quickly find a parameter by fuzzy matching (knocking out some characters of the parameter name). Trigger Demo
  3. Some parameters will be prompted with optional values Trigger Demo

Event prompt

Some components have callback events. By starting with @, the corresponding event names can be listed. On the right side, there is a description corresponding to the event. Press Enter to automatically type. Trigger Demo