[{
//obj 1
link: [{
//obj 2
link: [{
//obj 3
}]
}]
}]
配列は、任意の数を保持することができますが、次のように私の配列構造がある https://codepen.io/wombsplitter/pen/KyWKod
を扱ってるものの例と機能をレンダリングすると、配列/オブジェクトを歩きますどのレベルの要素でも使用できます。再帰的に道を歩み、レンダリング機能を使用して、構造を保存しながらページにそれらを印刷したい。
div.item
div.info
div.link
div.info
div.link
div.info
div.link
div.info
div.link
ご協力いただければ幸いです。
何これについて：
renderFunction(h, arr) {
return renderStructure(this.test, h)
}
// outside of your App object
function rendeStructure(test, h){
return h('div', { class: 'link'}, test.map(t => {
return h('div', {class: 'info'}, [t.name, renderStructure(t.links, h)]);
}))
}
これは、データにサイクルがないことを前提としています。
私はそれをちょっと変えなければなりませんでしたが、それはトリックをやっているようです、ありがとう。 –
Cool。私はVueを使用していないので、私は事の仕組みについていくつかの仮定をしました – bigblind
あなたはあなたのコード内erorrは、私はあなたがthis.test.map
renderFunction(h, arr) {
return h('div', { class: 'link'}, arr.map(t => {
return h('div', t.name);
}
レイジー方法を呼んでいたarr.map呼んでいる下記参照持って、正しいはずです：
function recurse(obj){
var html = ['<div class="info"></div>'];
html.push('<div class="link">')
if(!!obj.link) html.push(recurse(obj.link[0]));
html.push('</div>')
return html.join('')
}
document.getElementsByClassName('item')[0].innerHtml = recurse(obj[0]);
あなただけの値たい場合は、これを行うことができます：
function getVals(mixed){
var r = [];
function rec(mixed){
var a;
if(mixed instanceof Array){
for(var i=0,l=mixed.length; i<l; i++){
a = mixed[i];
if(typeof a === 'object' && a !== null){
return rec(a);
}
else{
r.push(a);
}
}
}
else if(typeof mixed === 'object' && mixed !== null){
for(var i in mixed){
a = mixed[i];
if(typeof a === 'object' && a !== null){
return rec(a);
}
else{
r.push(a);
}
}
}
else{
r.push(mixed);
}
return r;
}
return rec(mixed);
}
var obj = {
el: '#app',
data: {
test: [{
name: 'parent',
link: [{
name: 'child1',
link: [{
name: 'child2',
deepObj: {
deepProp:'Number 7 test',
num:7,
deeperArray:[true, false, 'test', 'in', 'here', 1]
}
}]
}]
},
{
name: 'parent2'
}]
}
}
var vals = getVals(obj);
// getVals returns an Array, hence the .join()
console.log(vals.join(', ')); console.log(vals);
があなたのコンソールがあなたの構造を示すべきです。オブジェクトでない場合は、値を欲しいだけですか？ – PHPglue
私は、各配列の各オブジェクトがプロパティを保持する可能性が高いので、各サブ配列を歩き回り、そのデータを印刷することを追加する必要があります。 –