I originally used jQuery to change these header tags as follows:
Code:
$(document).ready(function() {
$("title").text("Page Title with jQuery");
$('meta[name="description"]').attr("content","Page Description with jQuery");
$('meta[name="keywords"]').attr("content", "Page Keywords (Obsolete) with jQuery");
});
var title = new Vue({
el: "title",
data: {
title: "Page Title with Vue.js"
}
});
var meta_desc = new Vue({
el: 'meta[name="description"]',
data: {
desc: "Page Description with Vue.js"
}
});
var meta_keywords = new Vue({
el: 'meta[name="keywords"]',
data: {
keywords: "My Obsolete Keywords with Vue.js"
}
});
So, you can see that Vue.js can be used like jQuery to easily bind to elements in the header of an HTML file using jQuery type selectors.
This is a very simply example but since I could not find this example on the net, I posted it here.
I tried combining multiple elements (el:) in one new Vue() instance but I could not get it to work as expected; so I assume that only one element could be "binded or bound" in a single Vue directive; but will need to confirm this later.
So, after thinking about this, I simplified my Vue.js code to select the <head> element for the Vue instance:
Code:
var vm = new Vue({
el: "head",
data: {
title: "Vue.js - The UNIX and Linux Forums",
desc: "My Vue.js - The UNIX and Linux Forums",
keywords: "My (Obsolete) Keywords"
}
});
I've been slow to learn new Javascript web development frameworks over the years (my bad).
A number of people have asked me how to get started with Vue.js and my reply before today was to Google "Vue.js". That has changed and my recommendation to anyone who wants to learn the fastest growing, easiest to learn and use Vue.js web dev framework is to watch this video tutorial series:
... (0 Replies)
Vue Router has some quirks and on of the quirks is that it is not reliable when adding external links using the vue-router library.
After struggling with many solutions, I have found that creating a simple Vue.js component like this one seems to work the best (so far):
Component Example: ... (0 Replies)
A shout out to Scott who gave me a helping hand to turn a simple sample Vue.js app I wrote yesterday into a Vue.js component:
Vue.component("unix-time", {
template: `<div class="time">{{unixtime}}</div>`,
data() {
return {
unixtime: ""
};
},
methods: {
... (1 Reply)
I would like to capture output from two commands to a test file on the same line...
I want to get a file with all Applications and the Version of it...here are the two commands I use to get the output.
To get Application list I use
ls -1 /Applications/ |grep .app >>... (3 Replies)
Hi Guys,
what is a meta file system ? what is it use for?
What is /etc/vfstab?
What is the relationship between the "vfstab file and meta file system. (3 Replies)
I have added a sun storage array from a faiulty server onto a new server and copied the md.conf files etc. I can now access the /dev/md/dsk file systems, but I want to delete some metadevices that do not exist (it still thinks the 0 and 1 (root /var /export) disk are mirrored. How do I do this? (8 Replies)
