Vue.js ਮੁੱਖ ਤੌਰ 'ਤੇ ਐਪਲੀਕੇਸ਼ਨ ਦੇ ਵਿਜ਼ੂਅਲਾਈਜ਼ੇਸ਼ਨ ਹਿੱਸੇ 'ਤੇ ਕੇਂਦ੍ਰਤ ਕਰਦਾ ਹੈ, ਜਿਸ ਨੂੰ ਫਰੰਟ-ਐਂਡ ਵਿਕਾਸ ਵੀ ਕਿਹਾ ਜਾਂਦਾ ਹੈ। Vue.js ਦਿਨ-ਬ-ਦਿਨ ਪ੍ਰਸਿੱਧ ਹੋ ਰਿਹਾ ਹੈ ਕਿਉਂਕਿ ਇਹ ਦੂਜੇ ਪ੍ਰੋਜੈਕਟਾਂ ਅਤੇ ਲਾਇਬ੍ਰੇਰੀਆਂ ਨਾਲ ਏਕੀਕ੍ਰਿਤ ਕਰਨਾ ਬਹੁਤ ਆਸਾਨ ਹੈ। ਇਹ ਇੰਸਟਾਲ ਅਤੇ ਵਰਤਣ ਲਈ ਬਹੁਤ ਹੀ ਸਧਾਰਨ ਹੈ.
Vue.js ਇੱਕ ਪ੍ਰਗਤੀਸ਼ੀਲ JavaScript ਫਰੇਮਵਰਕ ਹੈ ਓਪਨ ਸੋਰਸ ਇੰਟਰਐਕਟਿਵ ਵੈੱਬ ਯੂਜ਼ਰ ਇੰਟਰਫੇਸ ਅਤੇ ਸਿੰਗਲ ਪੇਜ ਐਪਲੀਕੇਸ਼ਨ (SPAs) ਦੇ ਵਿਕਾਸ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। Vue.js ਨੂੰ ਆਮ ਤੌਰ 'ਤੇ Vue ਕਿਹਾ ਜਾਂਦਾ ਹੈ ਅਤੇ ਇਸਨੂੰ "view.js" ਜਾਂ "view" ਕਿਹਾ ਜਾਂਦਾ ਹੈ।
ਇੱਕ ਸਿੰਗਲ ਪੇਜ ਐਪਲੀਕੇਸ਼ਨ ਜਾਂ SPA ਇੱਕ ਵੈਬ ਐਪਲੀਕੇਸ਼ਨ ਜਾਂ ਵੈਬਸਾਈਟ ਹੈ ਜੋ ਉਪਭੋਗਤਾਵਾਂ ਨੂੰ ਇੱਕ ਡੈਸਕਟੌਪ ਐਪਲੀਕੇਸ਼ਨ ਵਾਂਗ ਇੱਕ ਬਹੁਤ ਹੀ ਨਿਰਵਿਘਨ, ਜਵਾਬਦੇਹ ਅਤੇ ਤੇਜ਼ ਅਨੁਭਵ ਪ੍ਰਦਾਨ ਕਰਦੀ ਹੈ। ਇੱਕ ਸਿੰਗਲ ਪੇਜ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ ਇੱਕ ਪੰਨੇ 'ਤੇ ਇੱਕ ਮੀਨੂ, ਬਟਨ ਅਤੇ ਬਲਾਕ ਸ਼ਾਮਲ ਹੁੰਦੇ ਹਨ। ਜਦੋਂ ਇੱਕ ਉਪਭੋਗਤਾ ਉਹਨਾਂ ਵਿੱਚੋਂ ਇੱਕ 'ਤੇ ਕਲਿਕ ਕਰਦਾ ਹੈ, ਤਾਂ ਇਹ ਸਰਵਰ ਤੋਂ ਪੂਰੇ ਨਵੇਂ ਪੰਨਿਆਂ ਨੂੰ ਲੋਡ ਕਰਨ ਦੀ ਬਜਾਏ ਗਤੀਸ਼ੀਲ ਤੌਰ 'ਤੇ ਮੌਜੂਦਾ ਪੰਨੇ ਨੂੰ ਮੁੜ ਲਿਖਦਾ ਹੈ। ਇਹ ਇਸਦੀ ਜਵਾਬਦੇਹ ਸਪੀਡ ਦੇ ਪਿੱਛੇ ਦਾ ਕਾਰਨ ਹੈ।
Vue ਅਸਲ ਵਿੱਚ ਫਰੰਟਐਂਡ ਵਿਕਾਸ ਲਈ ਵਿਕਸਤ ਕੀਤਾ ਗਿਆ ਹੈ, ਇਸਲਈ ਇਸਨੂੰ ਬਹੁਤ ਸਾਰੀਆਂ HTML, JavaScript ਅਤੇ CSS ਫਾਈਲਾਂ ਨੂੰ ਸੰਭਾਲਣਾ ਪੈਂਦਾ ਹੈ. Vue.js ਉਪਭੋਗਤਾਵਾਂ ਲਈ HTML ਗੁਣਾਂ ਦੇ ਨਾਲ HTML ਦਾ ਵਿਸਤਾਰ ਕਰਨਾ ਆਸਾਨ ਬਣਾਉਂਦਾ ਹੈ ਜਿਸਨੂੰ ਨਿਰਦੇਸ਼ ਕਹਿੰਦੇ ਹਨ। Vue.js ਬਿਲਟ-ਇਨ ਨਿਰਦੇਸ਼ ਅਤੇ ਕਈ ਨਿਰਦੇਸ਼ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ defiHTML ਐਪਲੀਕੇਸ਼ਨਾਂ ਦੀ ਕਾਰਜਕੁਸ਼ਲਤਾ ਨੂੰ ਬਿਹਤਰ ਬਣਾਉਣ ਲਈ ਉਪਭੋਗਤਾ ਦੁਆਰਾ ਨਾਈਟ.
ਹੇਠਾਂ Vue.js ਦੀਆਂ ਸਭ ਤੋਂ ਮਹੱਤਵਪੂਰਨ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਦੀ ਸੂਚੀ ਹੈ:
Vue.js ਕੰਪੋਨੈਂਟ ਇਸ ਫਰੇਮਵਰਕ ਦੀਆਂ ਮਹੱਤਵਪੂਰਨ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਵਿੱਚੋਂ ਇੱਕ ਹਨ। ਉਹਨਾਂ ਦੀ ਵਰਤੋਂ ਮੁੜ ਵਰਤੋਂ ਯੋਗ ਕੋਡ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨ ਲਈ ਮੂਲ HTML ਤੱਤਾਂ ਨੂੰ ਵਧਾਉਣ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ। ਤੁਸੀਂ Vue.js ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਮੁੜ ਵਰਤੋਂ ਯੋਗ ਕਸਟਮ ਐਲੀਮੈਂਟਸ ਬਣਾ ਸਕਦੇ ਹੋ ਜੋ ਬਾਅਦ ਵਿੱਚ HTML ਵਿੱਚ ਦੁਬਾਰਾ ਵਰਤੇ ਜਾ ਸਕਦੇ ਹਨ।
Vue.js HTML-ਅਧਾਰਿਤ ਟੈਂਪਲੇਟ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ ਜੋ ਕਿ ਰੈਂਡਰ ਕੀਤੇ DOM ਨੂੰ Vue ਉਦਾਹਰਨ ਡੇਟਾ ਨਾਲ ਜੋੜਨ ਲਈ ਵਰਤਿਆ ਜਾ ਸਕਦਾ ਹੈ। ਸਾਰੇ Vue ਟੈਂਪਲੇਟ ਵੈਧ HTML ਹਨ ਜਿਨ੍ਹਾਂ ਨੂੰ ਵਿਸ਼ੇਸ਼-ਅਨੁਕੂਲ ਬ੍ਰਾਊਜ਼ਰਾਂ ਅਤੇ HTML ਪਾਰਸਰਾਂ ਦੁਆਰਾ ਪਾਰਸ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ। Vue.js ਮਾਡਲਾਂ ਨੂੰ ਵਰਚੁਅਲ DOM ਰੈਂਡਰਿੰਗ ਫੰਕਸ਼ਨਾਂ ਵਿੱਚ ਕੰਪਾਇਲ ਕਰਦਾ ਹੈ। Vue ਬ੍ਰਾਊਜ਼ਰ ਨੂੰ ਤਾਜ਼ਾ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ ਭਾਗਾਂ ਨੂੰ ਵਰਚੁਅਲ DOM ਮੈਮੋਰੀ ਵਿੱਚ ਰੈਂਡਰ ਕਰਦਾ ਹੈ। Vue ਮੁੜ-ਰੈਂਡਰ ਕਰਨ ਲਈ ਭਾਗਾਂ ਦੀ ਘੱਟੋ-ਘੱਟ ਸੰਖਿਆ ਦੀ ਵੀ ਗਣਨਾ ਕਰ ਸਕਦਾ ਹੈ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨ ਸਥਿਤੀ ਨੂੰ ਬਦਲਣ ਵੇਲੇ DOM ਹੇਰਾਫੇਰੀ ਦੀ ਘੱਟੋ-ਘੱਟ ਮਾਤਰਾ ਨੂੰ ਲਾਗੂ ਕਰ ਸਕਦਾ ਹੈ।
Vue ਇੱਕ ਜਵਾਬਦੇਹ ਸਿਸਟਮ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ ਜੋ ਸਧਾਰਨ JavaScript ਵਸਤੂਆਂ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ ਅਤੇ ਮੁੜ-ਰੈਂਡਰਿੰਗ ਨੂੰ ਅਨੁਕੂਲ ਬਣਾਉਂਦਾ ਹੈ। ਇਸ ਪ੍ਰਕਿਰਿਆ ਵਿੱਚ, ਹਰੇਕ ਕੰਪੋਨੈਂਟ ਆਪਣੀ ਪ੍ਰਤੀਕਿਰਿਆਸ਼ੀਲ ਨਿਰਭਰਤਾ ਦਾ ਧਿਆਨ ਰੱਖਦਾ ਹੈ, ਇਸਲਈ ਸਿਸਟਮ ਨੂੰ ਪਤਾ ਹੁੰਦਾ ਹੈ ਕਿ ਕਦੋਂ ਅਤੇ ਕਿਹੜੇ ਭਾਗਾਂ ਨੂੰ ਮੁੜ-ਰੈਂਡਰ ਕਰਨਾ ਹੈ।
ਪੇਜ ਨੈਵੀਗੇਸ਼ਨ ਵੀਯੂ-ਰਾਊਟਰ ਦੀ ਮਦਦ ਨਾਲ ਕੀਤੀ ਜਾਂਦੀ ਹੈ। ਤੁਸੀਂ ਆਪਣੀ ਸਿੰਗਲ ਪੇਜ ਐਪਲੀਕੇਸ਼ਨ ਲਈ ਅਧਿਕਾਰਤ ਤੌਰ 'ਤੇ ਸਮਰਥਿਤ ਵੀਯੂ-ਰਾਊਟਰ ਲਾਇਬ੍ਰੇਰੀ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ।
Vue ਤੁਹਾਨੂੰ DOM ਤੋਂ ਐਲੀਮੈਂਟਸ ਪਾਏ, ਅੱਪਡੇਟ ਕੀਤੇ ਜਾਂ ਹਟਾਏ ਜਾਣ 'ਤੇ ਵੱਖ-ਵੱਖ ਪਰਿਵਰਤਨ ਪ੍ਰਭਾਵਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ।
Vue.js ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੇ ਕਈ ਤਰੀਕੇ ਹਨ। ਤੁਸੀਂ ਇਸਦੀ ਅਧਿਕਾਰਤ ਸਾਈਟ 'ਤੇ ਜਾ ਕੇ ਇਸਨੂੰ ਸਥਾਪਿਤ ਕਰ ਸਕਦੇ ਹੋ ਜਾਂ ਤੁਸੀਂ CDN ਲਾਇਬ੍ਰੇਰੀ ਤੋਂ ਵੀ Vue.js ਫਾਈਲ ਦੀ ਵਰਤੋਂ ਸ਼ੁਰੂ ਕਰ ਸਕਦੇ ਹੋ। ਆਉ ਆਪਣੇ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ Vue.js ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੇ ਕੁਝ ਤਰੀਕੇ ਹੇਠਾਂ ਵੇਖੀਏ।
ਜੇਕਰ ਤੁਸੀਂ ਟੈਗ ਦੀ ਵਰਤੋਂ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ <script> Vue.js ਦਾ ਸਿੱਧਾ ਤੁਹਾਡੀ HTML ਫਾਈਲ ਵਿੱਚ, ਤੁਹਾਨੂੰ ਇਸਨੂੰ ਅਧਿਕਾਰਤ ਵੈੱਬਸਾਈਟ ਤੋਂ ਡਾਊਨਲੋਡ ਕਰਨ ਦੀ ਲੋੜ ਹੈ।
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body>
</body>
</html> ਚਲੋ Vue.js ਦੀ ਅਧਿਕਾਰਤ ਵੈੱਬਸਾਈਟ 'ਤੇ ਚੱਲੀਏ https://vuejs.org/v2/guide/installation.html ਆਪਣੀ ਲੋੜ ਅਨੁਸਾਰ vue.js ਨੂੰ ਡਾਊਨਲੋਡ ਕਰਨ ਲਈ.
ਤੁਸੀਂ ਆਪਣੀ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ, CDN ਤੋਂ Vue.js ਫਾਈਲ ਦੀ ਵਰਤੋਂ ਵੀ ਕਰ ਸਕਦੇ ਹੋ। ਤੱਤ ਦੇ ਅੰਦਰ https://unpkg.com/vue@3/dist/vue.global.js ਲਿੰਕ ਦੀ ਵਰਤੋਂ ਕਰੋ <script>, ਹੇਠਾਂ ਦਿੱਤੇ ਅਨੁਸਾਰ:
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>Vue.js ਇੱਕ ਨਵੀਨਤਮ ਸਾਫਟਵੇਅਰ ਤਕਨੀਕ ਹੈ ਜੋ ਵੈੱਬ ਵਿਕਾਸ ਅਤੇ ਸਿੰਗਲ ਪੇਜ ਐਪਲੀਕੇਸ਼ਨਾਂ (SPA) ਬਣਾਉਣ ਲਈ ਵਿਆਪਕ ਤੌਰ 'ਤੇ ਵਰਤੀ ਜਾਂਦੀ ਹੈ। ਜਿਵੇਂ ਕਿ ਤੁਸੀਂ ਨਾਮ ਤੋਂ ਅੰਦਾਜ਼ਾ ਲਗਾ ਸਕਦੇ ਹੋ, ਇਹ ਜਿਆਦਾਤਰ UI ਜਾਂ ਪ੍ਰੋਜੈਕਟ ਦੇ ਡਿਸਪਲੇ ਸਾਈਡ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ.
ਆਉ ਤੁਹਾਡੇ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ Vue.js ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੇ ਫਾਇਦੇ ਦੇਖੀਏ:
Vue.js ਦਾ ਸਭ ਤੋਂ ਵੱਡਾ ਫਾਇਦਾ ਇਹ ਹੈ ਕਿ ਇਹ ਆਕਾਰ ਵਿੱਚ ਬਹੁਤ ਛੋਟਾ ਹੈ। JavaScript ਫਰੇਮਵਰਕ ਦੀ ਸਫਲਤਾ ਇਸਦੇ ਆਕਾਰ 'ਤੇ ਬਹੁਤ ਨਿਰਭਰ ਕਰਦੀ ਹੈ ਅਤੇ ਇਹ ਦਿਲਚਸਪ JavaScript ਪਲੱਗਇਨ ਸਿਰਫ 18-21KB ਹੈ, ਇਸਲਈ ਤੁਸੀਂ ਇਸ ਨੂੰ ਬਿਨਾਂ ਕਿਸੇ ਸਮੇਂ ਡਾਊਨਲੋਡ ਅਤੇ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ।
Vue.js ਫਰੇਮਵਰਕ ਵਿੱਚ ਇੱਕ ਬਹੁਤ ਹੀ ਸਧਾਰਨ ਬਣਤਰ ਹੈ ਅਤੇ ਇਹ ਸਮਝਣ ਵਿੱਚ ਬਹੁਤ ਆਸਾਨ ਹੈ। ਇਹ ਇਸ ਫਰੇਮਵਰਕ ਦੀ ਪ੍ਰਸਿੱਧੀ ਦਾ ਇੱਕ ਕਾਰਨ ਹੈ. ਜੇਕਰ ਤੁਸੀਂ HTML ਅਤੇ JavaScript ਤੋਂ ਜਾਣੂ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਆਸਾਨੀ ਨਾਲ Vue.js ਵਿੱਚ ਕੋਡ ਕਰ ਸਕਦੇ ਹੋ। ਉਪਭੋਗਤਾ ਆਸਾਨੀ ਨਾਲ Vue.js ਨੂੰ ਇਸਦੇ ਸਧਾਰਨ ਢਾਂਚੇ ਦੇ ਕਾਰਨ ਆਪਣੇ ਵੈਬ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ ਜੋੜ ਸਕਦੇ ਹਨ ਅਤੇ ਐਪਲੀਕੇਸ਼ਨਾਂ ਨੂੰ ਵਿਕਸਿਤ ਕਰ ਸਕਦੇ ਹਨ।
Vue.js ਵਿੱਚ ਹਰ ਚੀਜ਼ ਲਈ ਬਹੁਤ ਸਾਰੇ ਭਾਗ ਹਨ ਅਤੇ ਮੌਜੂਦਾ ਐਪਲੀਕੇਸ਼ਨਾਂ ਨਾਲ ਬਹੁਤ ਤੇਜ਼ੀ ਨਾਲ ਜੋੜਿਆ ਜਾ ਸਕਦਾ ਹੈ। ਤੁਸੀਂ ਇਸਨੂੰ JavaScript ਵਿੱਚ ਲਿਖੀ ਕਿਸੇ ਵੀ ਐਪਲੀਕੇਸ਼ਨ ਨਾਲ ਜੋੜ ਸਕਦੇ ਹੋ।
Vue.js ਦੀ ਲਚਕਦਾਰ ਪ੍ਰਕਿਰਤੀ ਵੀ React.js, Angular.js, ਅਤੇ ਕਿਸੇ ਵੀ ਹੋਰ ਨਵੇਂ JavaScript ਫਰੇਮਵਰਕ ਦੇ ਵਿਕਾਸਕਾਰਾਂ ਲਈ ਸਮਝਣਾ ਆਸਾਨ ਬਣਾਉਂਦੀ ਹੈ। ਇਹ HTML ਫਾਈਲਾਂ, JavaScript ਫਾਈਲਾਂ ਅਤੇ ਸ਼ੁੱਧ JavaScript ਫਾਈਲਾਂ ਨੂੰ ਲਿਖਣ ਲਈ ਵਰਚੁਅਲ ਨੋਡਸ ਦੀ ਵਰਤੋਂ ਕਰਨ ਲਈ ਬਹੁਤ ਜ਼ਿਆਦਾ ਲਚਕਤਾ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ.
ਤੁਸੀਂ ਕਸਟਮ ਐਲੀਮੈਂਟ ਬਣਾ ਸਕਦੇ ਹੋ ਜੋ Vue.js ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਮੁੜ ਵਰਤੋਂ ਯੋਗ ਹਨ।
Vue.js ਬਹੁਤ ਹੀ ਸਰਲ, ਸੰਪੂਰਨ ਅਤੇ ਵਿਸਤ੍ਰਿਤ ਦਸਤਾਵੇਜ਼ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ, ਇਸਲਈ ਡਿਵੈਲਪਰ ਜਿਨ੍ਹਾਂ ਨੂੰ HTML ਅਤੇ JavaScript ਬਾਰੇ ਬਹੁਤ ਘੱਟ ਜਾਣਕਾਰੀ ਹੈ ਉਹ ਪ੍ਰੋਗਰਾਮ ਲਈ ਇਸਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹਨ।
Vue.js ਵਰਚੁਅਲ DOM ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ ਜਿਵੇਂ ਕਿ ਹੋਰ ਮੌਜੂਦਾ ਫਰੇਮਵਰਕ ਜਿਵੇਂ ਕਿ ReactJS, Ember, ਆਦਿ। ਵਰਚੁਅਲ DOM ਅਸਲ HTML DOM ਦੀ ਇੱਕ ਹਲਕਾ ਇਨ-ਮੈਮੋਰੀ ਟ੍ਰੀ ਪ੍ਰਤੀਨਿਧਤਾ ਹੈ ਅਤੇ ਸ਼ੁਰੂਆਤੀ DOM ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕੀਤੇ ਬਿਨਾਂ ਅੱਪਡੇਟ ਕੀਤਾ ਜਾਂਦਾ ਹੈ।
Vue.js ਆਪਣੇ ਮਾਡਲ ਵਿਊ ਵਿਊ ਮਾਡਲ (MVVM) ਆਰਕੀਟੈਕਚਰ ਨਾਲ ਦੋ-ਪੱਖੀ ਸੰਚਾਰ ਪ੍ਰਦਾਨ ਕਰਦਾ ਹੈ ਜੋ HTML ਬਲਾਕਾਂ ਦੇ ਪ੍ਰਬੰਧਨ ਨੂੰ ਸਰਲ ਬਣਾਉਂਦਾ ਹੈ।
ਫਰੇਮਵਰਕ ਇੱਕ ਸਿਸਟਮ ਦੇ ਨਾਲ ਆਉਂਦਾ ਹੈ ਜੋ ਸਾਨੂੰ ਸਧਾਰਨ ਅਤੇ ਸਿੱਧੇ ਮਾਡਲ ਸੰਟੈਕਸ ਦੀ ਵਰਤੋਂ ਕਰਕੇ DOM ਨੂੰ ਡੈਟਾ ਨੂੰ ਘੋਸ਼ਣਾਤਮਕ ਰੂਪ ਵਿੱਚ ਪੇਸ਼ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ।
ਇੱਥੇ ਇੱਕ ਉਦਾਹਰਨ ਹੈ:
<body>
<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'This is a simple Vue.js Declarative Rendering example!'
}
})
</script>
</body>Vue.js ਫਰੇਮਵਰਕ ਸਾਨੂੰ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ definire HTML ਗੁਣਾਂ ਨੂੰ ਨਿਰਦੇਸ਼ ਕਹਿੰਦੇ ਹਨ, ਜੋ ਕਿ HTML ਐਪਲੀਕੇਸ਼ਨਾਂ ਨੂੰ ਕਾਰਜਕੁਸ਼ਲਤਾ ਪ੍ਰਦਾਨ ਕਰਨ ਲਈ ਵਰਤੇ ਜਾਂਦੇ ਹਨ।
Vue.js ਵਿੱਚ ਦੋ ਤਰ੍ਹਾਂ ਦੇ ਨਿਰਦੇਸ਼ ਹਨ:
Vue.js ਡਾਟਾ ਲਈ ਪਲੇਸਹੋਲਡਰ ਦੇ ਤੌਰ 'ਤੇ ਡਬਲ ਬਰੇਸ {{}} ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ, ਅਤੇ Vue.js ਨਿਰਦੇਸ਼ HTML ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਹਨ ਜੋ ਇੱਕ v- ਅਗੇਤਰ ਦੀ ਵਰਤੋਂ ਕਰਦੀਆਂ ਹਨ।
ਇੱਕ Vue ਐਪ ਇੱਕ ਸਿੰਗਲ DOM ਤੱਤ ਨਾਲ ਜੁੜਦਾ ਹੈ ਅਤੇ ਇਸਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਕੰਟਰੋਲ ਕਰਦਾ ਹੈ। ਉਪਰੋਕਤ ਉਦਾਹਰਨ ਵਿੱਚ, ਇਹ #app ਹੈ।
Vue ਨਾਲ ਅਸੀਂ HTML ਨੂੰ ਐਂਟਰੀ ਪੁਆਇੰਟ ਦੇ ਤੌਰ 'ਤੇ ਵਿਚਾਰ ਕਰ ਸਕਦੇ ਹਾਂ, ਅਤੇ ਬਾਕੀ ਸਭ ਕੁਝ ਬਣਾਏ ਗਏ Vue ਉਦਾਹਰਣ ਦੇ ਅੰਦਰ ਹੁੰਦਾ ਹੈ।
ਆਉ ਇੱਕ ਉਦਾਹਰਨ ਵੇਖੀਏ ਜਿੱਥੇ ਅਸੀਂ ਤੱਤ ਅਤੇ ਗੁਣ ਬਾਈਡਿੰਗ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰਦੇ ਹਾਂ:
<html>
<head>
<link rel="stylesheet" href="index.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app-2">
<span v-bind:title="message">
Hover mouse over me for a few seconds
and see a dynamically bound title which I have set!
</span>
</div>
<script>
var app2 = new Vue({
el: '#app-2',
data: {
message: 'You loaded this page on ' + new Date().toLocaleString()
}
})
</script>
</body>
</html> ਇਸ ਸਥਿਤੀ ਵਿੱਚ, ਨਵੀਂ v-ਬਾਈਡ ਵਿਸ਼ੇਸ਼ਤਾ ਨਿਰਦੇਸ਼ਕ ਹੈ। ਨਿਰਦੇਸ਼ਾਂ ਦੀ ਵਰਤੋਂ ਇੱਕ v- ਅਗੇਤਰ ਨਾਲ ਇਹ ਦਰਸਾਉਣ ਲਈ ਕੀਤੀ ਜਾਂਦੀ ਹੈ ਕਿ ਉਹ Vue ਦੁਆਰਾ ਪ੍ਰਦਾਨ ਕੀਤੀਆਂ ਵਿਲੱਖਣ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਹਨ, ਅਤੇ ਰੈਂਡਰ ਕੀਤੇ DOM ਲਈ ਵਿਸ਼ੇਸ਼ ਜਵਾਬਦੇਹ ਵਿਵਹਾਰ ਨੂੰ ਲਾਗੂ ਕਰਨ ਲਈ ਵਰਤੀਆਂ ਜਾਂਦੀਆਂ ਹਨ।
ਉਦਾਹਰਣ ਦਾ ਨਤੀਜਾ ਹੇਠਾਂ ਦਿੱਤਾ ਗਿਆ ਹੈ
Ercole Palmeri
ਐਪਲ ਵਿਜ਼ਨ ਪ੍ਰੋ ਕਮਰਸ਼ੀਅਲ ਵਿਊਅਰ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ ਇੱਕ ਓਫਥਲਮੋਪਲਾਸਟੀ ਓਪਰੇਸ਼ਨ ਕੈਟਾਨੀਆ ਪੌਲੀਕਲੀਨਿਕ ਵਿਖੇ ਕੀਤਾ ਗਿਆ ਸੀ...
ਰੰਗਾਂ ਰਾਹੀਂ ਵਧੀਆ ਮੋਟਰ ਹੁਨਰਾਂ ਦਾ ਵਿਕਾਸ ਕਰਨਾ ਬੱਚਿਆਂ ਨੂੰ ਲਿਖਣ ਵਰਗੇ ਹੋਰ ਗੁੰਝਲਦਾਰ ਹੁਨਰਾਂ ਲਈ ਤਿਆਰ ਕਰਦਾ ਹੈ। ਰੰਗ ਕਰਨ ਲਈ…
ਜਲ ਸੈਨਾ ਖੇਤਰ ਇੱਕ ਸੱਚੀ ਗਲੋਬਲ ਆਰਥਿਕ ਸ਼ਕਤੀ ਹੈ, ਜਿਸ ਨੇ 150 ਬਿਲੀਅਨ ਮਾਰਕੀਟ ਵੱਲ ਨੈਵੀਗੇਟ ਕੀਤਾ ਹੈ...
ਪਿਛਲੇ ਸੋਮਵਾਰ, ਫਾਈਨੈਂਸ਼ੀਅਲ ਟਾਈਮਜ਼ ਨੇ ਓਪਨਏਆਈ ਨਾਲ ਇੱਕ ਸੌਦੇ ਦਾ ਐਲਾਨ ਕੀਤਾ। FT ਆਪਣੀ ਵਿਸ਼ਵ ਪੱਧਰੀ ਪੱਤਰਕਾਰੀ ਨੂੰ ਲਾਇਸੰਸ ਦਿੰਦਾ ਹੈ...
