我有vue-js组件，我有这两个函数，我想把它们传递到我的vue组件中，我该怎么做呢

Question

这是我用来生成颜色的第一个函数

<script>
shadeColor(color, percent) {
var R = parseInt(color.substring(1,3),16);
var G = parseInt(color.substring(3,5),16);
var B = parseInt(color.substring(5,7),16);
R = parseInt(R * (100 + percent) / 100);
G = parseInt(G * (100 + percent) / 100);
B = parseInt(B * (100 + percent) / 100);
R = (R<255)?R:255;  
G = (G<255)?G:255;  
B = (B<255)?B:255;  
var RR = ((R.toString(16).length==1)?"0"+R.toString(16):R.toString(16));
var GG = ((G.toString(16).length==1)?"0"+G.toString(16):G.toString(16));
var BB = ((B.toString(16).length==1)?"0"+B.toString(16):B.toString(16));
return "#"+RR+GG+BB;
},
</script>

还有我的第二个功能：

<script>
function flatten(data,color_var,order) 
{
data.forEach(function (element)
{
order++;
element.category_order = order;
if(element.children.length > 0) 
{
element.color = shadeColor(color_var,-4);
flatten(element.children,element.color,0);
} 
element.color = shadeColor(color_var,-4);
});
return data;
}
</script>

我想把这两个函数放在我的vue组件中我不知道怎么做这是我的vue-js代码：

<v-card flat>
<draggable
class="draggable"
tag="div"
:="dragOptions"
@input="emitter"
:move="checkMove"
:list="list"
:value="value"
@update="saveUpdatedOrder"
>
<div class="item-group text-right" :key="el.id" v-for="el in realValue"  :style=" 
{backgroundColor: el.color}" @click="loop">
<div class="item">{{ el.title }}</div>
<nested-test class="item-sub" :list="el.children" />
</div>
</draggable>
</v-card>

我正在使用vue draggable库我想在这个元素和孩子的列表中使用它们。有人能帮我吗？？

Answer 1

您可以为函数使用方法。

https://v1.vuejs.org/guide/events.html

在您的模板中：

<div id="example">
<button v-on:click="greet">Greet</button>
</div>

在您的脚本中：

var vm = new Vue({
el: '#example',
data: {
name: 'Vue.js'
},
// define methods under the `methods` object
methods: {
greet: function (event) {
// `this` inside methods point to the Vue instance
alert('Hello ' + this.name + '!')
// `event` is the native DOM event
alert(event.target.tagName)
}
}
})
// you can invoke methods in JavaScript too
vm.greet() // -> 'Hello Vue.js!'

Answer 2

i找到答案问题在中

flatten(elements,color){ 
console.log(elements);
elements.forEach(function(element)
{
console.log(this.shadeColor("fcfcfc", -5))
if (element.children.length > 0) 
{
console.log(element);
element.color = this.shadeColor(color, -5)
this.flatten(element.children, element.color)
}
element.color = this.shadeColor(color, -5)

}.bind(this))
return elements
}

答案只是我需要绑定(这个(