component and directive have same life cycle hook - ngonchanges

Directive has same lifecycle hook when to use these lifecyclehook in live environment.
if directive don't have View .then where we use lifecyclehook

Related

When using ssr: false (aka SPA-only), what are the benefits of Nuxt over Vue?

In nuxt.config.js I have configured ssr: false and I'm using some static hosting.
I understand that Nuxtjs with ssr: false is CSR (Client Side Rendering).
I wonder what is the difference between Nuxt and Vue in that case?
Nuxt's purpose is mainly SSG/SSR/Edge rendering (or anything tied to have your code coming from a server step at some point).
If you use ssr: false, you will indeed lose a lot of Nuxt's strengths, meanwhile, you will still have:
simple route creation with file-based rather than configuring a router.js file
automatic code-splitting of your routes
the whole Nuxt modules ecosystem
middlewares on the client side
auto-imported components and Vue's ref, reactive, onMounted etc for you (if using Composition API)
cool data fetching capabilities (if using Composition API)
automatic TS configuration (if using Nuxt3)
[more benefits...]
As you can see, even if you use Nuxt as SPA-only, you will still get some quality of life improvements in your developer journey (better "DX").
Is it worth an abstraction on top of vanilla Vue? Maybe, depends on how fast/custom you want your code to be and if you don't feel like re-implementing the features already available in Nuxt.

difference between using Vue Router replace and route redirect in Vue Router

I do not know the difference between using Router replace and route redirect
and how to use them in my project I am new in vue.js
The Documentation should give you all information necessary.
But to answer your question:
router.replace() replaces the current entry in the history stack, while route.redirect() actually redirects to another path, having both in the history stack.
a redirect will be triggered before any navigation guard and trigger a new navigation to the desired path.

Frontend/backend route configuration

$ tree .
.
├── main.go
└── static
└── output_of_npm_run_build
I used vue.js with vue router for the frontend and golang for backend. What I tried to accomplish:
use golang (either standard library or gorilla/mux) to take care of example.com/api/...
vue router to take care of all vue components (example.com, example.com/about, example.com/login, etc.)
RESTful APIs example.com/post/{post_id} for both frontend and backend
If I go to example.com and click the button about, vue router would display the about component and change the url to example.com/about without talking to the backend, which is expected. But if I enter example.com/about directly to the address bar and press enter, the request goes straight to the backend. Since the file about does not exist, it returns 404.
Is there a way to return static/index.html and somehow tells vue router to render xxx component even if example.com/xxx is sent directly by the browser to the server (with exception of example.com/api)?
Who should be responsible for routing example.com/post/{post_id}?
You need to update the hosting configuration. This issue used to be happened whenever I used Front-end JS frameworks such as React, Vue and so on.
So if you type example.com/about manually on address bar, the page would show '404 Not Found`.
I recommend this answer to solve your issue.
Vue router is not working with nginx

Vue Router Push method within Nuxt causing a page reload

Working on a Nuxt project and trying to programmatically change route.
In a method I am using this:
$nuxt.$router.push({
path: `vehicles-for-sale`
})
This looks like it initially works, but it then causes a page refresh to '/vehicles-for-sale?.
Is there anything different I need to do with Nuxt to get this working? I have a pages folder called 'vehicles-for-sale' and an index.vue file within that.
Simply use this:
this.$router.push('vehicles-for-sale')

Accessing an external php file in vue.js with axios

I am using axios inside a vue component and trying to call an "external" php file. I have my src folder. Inside that are my components. My root is court. I have a folder named ajax where all of my php server side pages live. From my component I am trying to call a page from the ajax folder but don't know how to get to it.
Court\
ajax\
results.php
src\
components\
search.vue
So in search.vue i have an axios call
axios.get('ajax/results.php',.....
But it never reaches that page. I am also using the built in server and when I try http://localhost:8080/court/ajax/results.php it can't find that page. How do I call results.php?