create a span inside a div dynamically in vuex - javascript

I'm using an existing web app created using vue.js. and below is the code.
function () {
var e = this,
t = e.$createElement,
n = e._self._c || t;
return e.message.text && "human" === e.message.type ? n("div", {
staticClass: "message-text"
}, [e._v("\n " + e._s(e.message.text) + "\n")]) : e.message.text && e.shouldRenderAsHtml ? n("div", {
staticClass: "message-text",
domProps: {
innerHTML: e._s(e.botMessageAsHtml)
}
}) : e.message.text && "bot" === e.message.type ? n("div", {
staticClass: "message-text"
}, [e._v("\n " + e._s(e.shouldStripTags ? e.stripTagsFromMessage(e.message.text) : e.message.text) + "\n")]) : e._e()
}
and here is my n function
function l(e, t) {
function n(e, t, n, i) {
console.log(typeof e + "\t" + typeof t + "\t" + typeof n + "\t" + typeof i);
return function () {
if (n in t) {
return function () {
if (i && "object" === He()(e[n])) {
return f()({}, l(t[n], e[n], i), l(e[n], t[n], i));
}
return function () {
if ("object" === He()(e[n])) {
return f()({}, e[n], t[n]);
}
return t[n];
}();
}();
}
return e[n];
}();
}
var i = arguments.length > 2 && void 0 !== arguments[2] && arguments[2];
return k()(e).map(function (r) {
var o = n(e, t, r, i);
return Ke()({}, r, o);
}).reduce(function (e, t) {
return f()({}, e, t);
}, {});
}
The above code basically creates a div tag with class name as message-text, I want to create a span inside this div. I am not at all good with vue.js and the code seems pretty confusing. please help me out in creating a span inside this div.

This looks like a compiled code and minified probably. But if you can't get the uncompiled version I would try and simplify the code as it has a spaghetti if else.
function(){
var e = this,
t = e.$createElement,
n = e._self._c || t,
result;
if(e.message.text && "human" === e.message.type){
result = n("div", {staticClass: "message-text"}, [e._v("\n " + e._s(e.message.text) + "\n")])
}else{
if(e.message.text && e.shouldRenderAsHtml){
result = n("div", {staticClass: "message-text",domProps: {innerHTML: e._s(e.botMessageAsHtml)}})
}else{
if(e.message.text && "bot" === e.message.type){
if(e.shouldStripTags){
result = n("div", {staticClass: "message-text"}, [e._v("\n " + e._s(e.stripTagsFromMessage(e.message.text)) + "\n")])
}else{
result = n("div", {staticClass: "message-text"}, [e._v("\n " + e._s(e.message.text) + "\n")])
}
} else {
result = e._e();
}
}
}
return result;
}
You probably need to look into function n which is taking the arguments "div" as string and css class as object "message-text" with other props like innerHTML...

Related

ObjectToQuery function return just the properties have values but i want all the properties

I am using this method in order to convert an Object to QueryString. QueryString is required for ajax send request.
var objectToQueryString = function(a) {
var prefix, s, add, name, r20, output;
s = [];
r20 = /%20/g;
add = function(key, value) {
// If value is a function, invoke it and return its value
value = (typeof value == 'function') ? value() : (value == null ? "" : value);
s[s.length] = encodeURIComponent(key) + "=" + encodeURIComponent(value);
};
if (a instanceof Array) {
for (name in a) {
add(name, a[name]);
}
} else {
for (prefix in a) {
buildParams(prefix, a[prefix], add);
}
}
output = s.join("&").replace(r20, "+");
return output;
};
function buildParams(prefix, obj, add) {
var name, i, l, rbracket;
rbracket = /\[\]$/;
if (obj instanceof Array) {
for (i = 0, l = obj.length; i < l; i++) {
if (rbracket.test(prefix)) {
add(prefix, obj[i]);
} else {
buildParams(prefix + "%" + (typeof obj[i] === "object" ? i : "") + "%", obj[i], add);
}
}
} else if (typeof obj == "object") {
// Serialize object item.
for (name in obj) {
buildParams(prefix + "%" + name + "%", obj[name], add);
}
} else {
// Serialize scalar item.
add(prefix, obj);
}
}
The following code convert the object to QueryString sucessfully but the properties with no values are omitted in the return QueryString. But i want all the properties of the object. It does not matter the object properties have value or not.
If you pass a property where the value is null, then the 'obj' parameter in this call will be null:
function buildParams(prefix, obj, add) {
Can you test your results when you change your 'buildParams' function to this:
function buildParams(prefix, obj, add) {
obj = obj || "";
var name, i, l, rbracket;
rbracket = /\[\]$/;
if (obj instanceof Array) {
for (i = 0, l = obj.length; i < l; i++) {
if (rbracket.test(prefix)) {
add(prefix, obj[i]);
} else {
buildParams(prefix + "%" + (typeof obj[i] === "object" ? i : "") + "%", obj[i], add);
}
}
} else if (typeof obj == "object") {
// Serialize object item.
for (name in obj) {
buildParams(prefix + "%" + name + "%", obj[name], add);
}
} else {
// Serialize scalar item.
add(prefix, obj);
}
}

Looking up an object property within the console. Syntax issue

I'm writing a compare function using objects. I know that if I have the following object - var obj{ one: "foo", two: bar"} and I want to look up a property then obj["one"] will work but obj[one] will not.
However when I do the comparison function it will correctly compare obj["one"] and obj2["one"], but when I'm trying to log it in the console the syntax obj[one] works and obj["one"] comes back as undefined. It doesn't affect the functionality of the code, but I'm confused.
var num = 2;
var num2 = 4;
var num3 = 4;
var num4 = 9;
var num5 = "4";
var obj = {here: {is: "an"}, object: 2};
var obj2 = {here: {is: "an"}, object: 2};
function deepEqual(el, el2) {
var outcome = false;
console.log("comparing " + el + " and " + el2);
if (typeof el == 'object' && typeof el2 == 'object') {
console.log("These are both objects");
if (Object.keys(el).length === Object.keys(el2).length) {
console.log("These objects have the same number of keys");
for (var x in el) {
if (el2.hasOwnProperty(x) && el["x"] === el2["x"]) {
console.log("comparing " + el[x] + " with " + el2[x]);
outcome = true;
} else {
return false;
}
}
} else return false;
} else if (el === el2) {
outcome = true;
}
return outcome;
}
So the part of the code I'm talking about is
if (el2.hasOwnProperty(x) && el["x"] === el2["x"]) {
console.log("comparing " + el[x] + " with " + el2[x]);
outcome = true;
} else {
return false;
}
This comes back correctly in the console as "comparing (property) with (property)". However if I write it like this
if (el2.hasOwnProperty(x) && el["x"] === el2["x"]) {
console.log("comparing " + el["x"] + " with " + el2["x"]);
outcome = true;
} else {
return false;
}
It says "comparing undefined with undefined".
Any insights?
in your code el["x"] does not refer to anything. There is no property in the el object that has an "x" key
you are in a for loop which define x so you need to use that variable instead of "x"
for (var x in el) {
if (el2.hasOwnProperty(x) && el[x] === el2[x]) {
console.log("comparing " + el[x] + " with " + el2[x]);
outcome = true;
} else {
return false;
}
}

Angularjs str_pad_left

Is there any angularjs or javascript function similiar to PHP str_pad_left ?
I could not get any result no input was written on screen.
Also i did not now if is it valid to pass the first parameter inside : {{}}.
I try use javascript str_pad function :
<script>
var num = str_pad({{ item.ID }}, 10,'','STR_PAD_LEFT')
document.write(num);
console.log('num '+num);
</script>
From this script :
function str_pad(input, pad_length, pad_string, pad_type) {
var half = '',
pad_to_go;
var str_pad_repeater = function(s, len) {
var collect = '',
i;
while (collect.length < len) {
collect += s;
}
collect = collect.substr(0, len);
return collect;
};
input += '';
pad_string = pad_string !== undefined ? pad_string : ' ';
if (pad_type !== 'STR_PAD_LEFT' && pad_type !== 'STR_PAD_RIGHT' && pad_type !== 'STR_PAD_BOTH') {
pad_type = 'STR_PAD_RIGHT';
}
if ((pad_to_go = pad_length - input.length) > 0) {
if (pad_type === 'STR_PAD_LEFT') {
input = str_pad_repeater(pad_string, pad_to_go) + input;
} else if (pad_type === 'STR_PAD_RIGHT') {
input = input + str_pad_repeater(pad_string, pad_to_go);
} else if (pad_type === 'STR_PAD_BOTH') {
half = str_pad_repeater(pad_string, Math.ceil(pad_to_go / 2));
input = half + input + half;
input = input.substr(0, pad_length);
}
}
return input;
}

Exit recursive function

I Loop through a complex JSON object but I want to stop the loop after n iterations
n = 0;
maxIterations = 100;
ObjectValues = function(v, k){
if(n == maxIterations){
if (typeof v == "object") {
for (var kp in v) {
if (Object.hasOwnProperty.call(v, kp)) {
ObjectValues(v[kp], k != undefined ? k + "." + kp : kp);
}
}
} else {
console.log(k + ":" + v);
n++;
}
}else{
console.log('I should end the function');
return false;
}
};
But I can't exit the function with return false. The function gets called, even after I tried to exit it with return false.
As I understand it, you want to recursively print maxiteration keys and their values:
n = 0;
maxIterations = 100;
ObjectValues = function(v, k){
if(n < maxIterations){
if (typeof v == "object") {
for (var kp in v) {
if (Object.hasOwnProperty.call(v, kp)) {
if(! ObjectValues(v[kp], k != undefined ? k + "." + kp : kp) )
return false;
}
}
} else {
console.log(k + ":" + v);
n++;
}
return true;
} else {
console.log('I should end the function');
return false;
}
};

Returning a comma separated string from a function breaking the code

I am calling this function:
val(array[i][index])
when i try to pass a time stamp 123,213,121,212
where:
function val(m) {
try {
if (m == null) return '';
if (typeof m == 'number') return num(m);
if (typeof m == 'string') return str(m);
if (typeof m == 'boolean') return m ? 'true' : 'false';
return m.length ? arr(m) : obj(m);
}
catch (err) {
return "";
}
}
function num(m) { return m; }
function str(m) {
return m.substr(0, 6) == '/Date(' ? dfmt(date(m)) : m;
}
function date(s) { return new Date(parseFloat(/Date\(([^)]+)\)/.exec(s)[1])); }
function pad(d) { return d < 10 ? '0' + d : d; }
function dfmt(d) { return d.getFullYear() + '/' + pad(d.getMonth() + 1) + '/' + pad(d.getDate()); }
The function failed.
It might be due to a comma.
How can i solve this.
Any help is appreciated
PROBLEM SOLVED:
Actually the value "123.135.414.414" is of Object type
SO i need to write something like:
function val(m) {
try {
if (m == null) return '';
if (typeof m == 'object') return m;
if (typeof m == 'number') return num(m);
if (typeof m == 'string') return str(m);
if (typeof m == 'boolean') return m ? 'true' : 'false';
return m.length ? arr(m) : obj(m);
}
catch (err) {
return "Time Stamp";
}
}
This solves my problem for this time.
Any further suggestion is welcomed
PROBLEM SOLVED:
Actually the value "123.135.414.414" is of Object type
SO i need to write something like:
function val(m) {
try {
if (m == null) return '';
if (typeof m == 'object') return m;
if (typeof m == 'number') return num(m);
if (typeof m == 'string') return str(m);
if (typeof m == 'boolean') return m ? 'true' : 'false';
return m.length ? arr(m) : obj(m);
}
catch (err) {
return "Time Stamp";
}
}

Categories

Resources