How to make most basic router-tab on Vue3? - tabs

I using vue3. I need to router-tabs likes vue-router-tab.
I tried to use vue-router-tab on Vue3, but its changelog shows that it only works with Vue2.
So I want to make a router tab myself. But I don't know how to make it.
Please tell me how to make the most basic router-tab.

You want to rely on Vue's <slot> method. There are multiple ways of doing it from there.
There's a LearnVue that will help you learn how to do it: https://learnvue.co/tutorials/vue-reusable-tabs-component

Related

PhpStorm generate template from code selection

I frequently use PhpStorm's Extract variable & method refactorings. Is there a way to add/extend functionality that could create a new template file from the selected code, prompt for desired template path, and create an include/require statement for that template?
I'm asking either for an entry point into coding this functionality, or extending existing functionality. Or maybe it's already available and I missed it.
As #Ástþór mentioned, there is no such way to change the refactoring templates.
You can use surround with live templates to emulate this behavior. This will not find duplicates and will not replace them as well, but may be it's close enough what you want.
Add a surround live template like this one. Open the editor with Ctrl+Alt+S:
Edit the variables in order to get a nicer UX:
Select the variable you want to extract and select Code > Surround with Live Templates from the menu or press Ctrl+Alt+J.
Adjust the templates to your needs.
Live template variables
HTH
No, there isn't. You can ask this question at https://intellij-support.jetbrains.com/hc/en-us/community/topics/200366979-IntelliJ-IDEA-Open-API-and-Plugin-Development
Other useful sources: https://www.jetbrains.org/intellij/sdk/docs/basics/getting_started.html & https://confluence.jetbrains.com/display/PhpStorm/Setting-up+environment+for+PhpStorm+plugin+development

Why can't I get this SLDS picklist to open?

I want to use the SLDS picklist found here.
I'm using several other SLDS elements in my page and they work fine, I have included the necessary SLDS css.
The picklist doesn't actually work in the example they provide so I'm wondering if there is additional configuration required? The documentation does not mention any.
Can anyone tell me what the problem is?
As of my understanding after reading the SLDS documentation the SLDS is just a CSS "framework". For the picklist to work (open) you need to include some Javascript and more specifically the picklist is "opened" by adding a class slds-is-open to the element (picklist). Apply the class to the div stated below.
<div class="slds-picklist slds-dropdown-trigger slds-dropdown-trigger--click slds-is-open" aria-expanded="true">
I can't really make a demo out of this since the SLDS is so complicated to install but hopefully this can help you.
Well those dropdowns require some kind of javascript or jquery so there should be a file you have to include. CSS just styles the content it doesen't make it work XD
if you not comfortable with JS you can use this JS library
or add slds-is-open class on click event
If you are working with desktop application only (no SalesForce1), a simple way to make it work without adding code is removing the trigger--click
Just let the div like this:
<div class="slds-dropdown-trigger slds-is-open"> *//your list//* </div>
And it will work when you put your mouse over the icon.
It will have a weird behavior in SalesForce1 because you can't put your finger "over" without "clicking" the screen, keep that in mind.
PS: slds-dropdown-trigger is deprecated at the moment in SLDS documentation, keep that in mind too.

how do i pagination works in HTML

i created a site, And added pages to my site, since page size exceeds i need to create pagination in html i have created this method
123
in this way i created
Problem is when i add new page i need to replace all code again like this
1234
ever time when i add new page i need to replace all code is ther a way to do this without PHP
Can sombody help me any idea to do this in html
Do not re-invent the wheel. Use datatables, they provide sorting, pagination (client side and server side), export and a number of additional features.
http://datatables.net/
Include the files and just add this.
$(document).ready(function() {
$('#example').dataTable();
} );
This is a very basic and good example, you should go for it.
http://datatables.net/examples/data_sources/dom.html
This cannot be done purely in HTML. You must use something like PHP, or you could use Javascript.
You can make just one HTML file called "Pagination.html" include all your links there and then include that Pagination on every page using one of the following methods.
You can use Javascript: javascript
Or you can use html5: html5
Or there are also, others solutions to solve your problem like this: other
You better use some Javascript oriented solution, html5 support for including files still very poor.
unfortunately, this won't be possible without using some other technology that is not HTML. You can dynamically generate pages using javascript (JS), PHP or other technology, but not just raw HTML.
You can name your pages something like:
page_1.html
page_2.html
and then whichever editor you are using probably has a search & replace function, so you could use that to speed up things. I hope this helps.

Gmod Lua Coding - How to place an HTML5 Page (Website) Inside of a Box

I've been working with a friend and we both have a problem, in a Garry's Mod Server, ok so we have a box saying Rules, and when we go to place a website INSIDE OF THAT BOX, it shows exactly this:
http://cloud-4.steamusercontent.com/ugc/37489242708029141/B4E51CC2F089F13DF25AA8F4F3E9BF7A07619427/
As you can see, it shows a box with the HTML5 coding, not sure if I can place:
http://www.sparkperp.com/Rules/index.html on that box.
I would like to know how to do that, if it's possible.
Thanks for your help
Please give your code in the future. Since I'm unable to view your code I'm limited in how much I can help, but I will try my best anyway!
You need to use the HTML vgui element vgui.Create("HTML") and use :OpenURL(weblink) on it. You can also use :SetHTML(htmlstring) if required. You should get the idea from the below code block:
local MOTD = vgui.Create( "HTML", parent )
MOTD:OpenURL("http://www.sparkperp.com/Rules/index.html")
If you can't get it working, update your question with your code and I'll be able to help further.

Add or Remove ng-controller

My problem is i need to execute multiple times one controller, but i need to control that action. How can i add or remove an ng-controller from html tag. For example i have controller with name view and i need an <div ng-controller="view"> but i need a method to toggle it to <div>. On toggle would be better to delete the controller that took place, but i think angular do that automatically Any idea, perhaps something with directives?
You should use a directive instead of a controller. Controllers are not meant to be set and removed like this, the only way to do so would be to recompile the HTML each time which would bring more problems than it solves.
In short, this is an XY problem, please try to step back and formulate what problem exactly you are trying to resolve.