小编Pyr*_*eal的帖子

active当我在下面的代码中切换变量时， activeCSS 类将从列表中的所有元素中应用/删除。如何单独定位列表元素？Todo-List 示例具有类似的功能（待办事项/待办事项已完成），但它有点超出了我的技能范围。

<ul>
    <li v-bind:class="{ active: active }" v-on:click="toggleActive">Test 1</li>
    <li v-bind:class="{ active: active }" v-on:click="toggleActive">Test 2</li>
    <li v-bind:class="{ active: active }" v-on:click="toggleActive">Test 3</li>
</ul>

toggleActive: function() {
    this.active = !this.active;
}

我在比较两个数组的元素并过滤掉匹配值时遇到了一些问题.我只想返回未包含在其中的数组元素wordsToRemove.

var fullWordList = ['1','2','3','4','5'];
var wordsToRemove = ['1','2','3'];

var filteredKeywords = fullWordList.forEach(function(fullWordListValue) {
    wordsToRemove.filter(function(wordsToRemoveValue) {
        return fullWordListValue !== wordsToRemoveValue
    })
});

console.log(filteredKeywords);

当满足将文本输入到不同组件文本区域的要求时，我需要更改特定组件文本区域内的文本。我尝试创建一个简单的示例来说明该问题。我的主要问题是定位正确的组件并编辑动态显示的文本。

父组件

<template>
    <reuseableComponent 
        input-type="textarea" v-model="Example1">
    </reuseableComponent>
    <reuseableComponent 
        input-type="textarea" v-model="Example2">
    </reuseableComponent>
<template>

可重复使用的组件

<textarea
    v-model='taValue' @input='$emit("input", taValue)'>
</textarea>

exampleMethod() {
    if(value) {
        //change text in Example2 textarea instance.
    }
}

我有一个工作函数,它针对textarea并将内容复制到剪贴板.它直接针对textarea时效果很好.

我需要针对子组件中的textarea提供相同的功能.我无法弄清楚如何定位每个组件中的特定区域.

工作范例:

<div class="media-label col-md-12">Product Title:</div>

<textarea 
  class="col-md-6 col-md-offset-3" 
  v-model="productTitle" 
  id="productTitle"
></textarea>

<button 
  type="button" 
  class="btn btn-info"
  data-copytarget="#productTitle" 
  v-on:click="copyTextArea"
>
  Copy Title To Clipboard
</button>

复制功能:

 copyTextArea(e) {
   var targetElement = e.target;
   var copiedTarget = targetElement.dataset.copytarget;
   var element = document.querySelector(copiedTarget);
   element.select();
   document.execCommand('copy');
 },

组件设置我遇到了以下问题:

<ExampleComponent
  title="Title" 
  input-type="textarea"
  v-model="productTitle" 
  id="productTitle" 
></ExampleComponent>

<button 
  type="button" 
  class="btn btn-info"
  copytarget="#productTitle" 
  v-on:click="copyTextArea"
>
  Copy Title To Clipboard
</button>

<ExampleComponent
  title="Description" 
  input-type="textarea"
  v-model="productTitle" 
  id="productTitle"
></ExampleComponent>

<button 
  type="button" 
  class="btn btn-info"
  copytarget="#productTitle" 
  v-on:click="copyTextArea"
>
  Copy Title To Clipboard
</button>