refatored and bug fix

kavalcante · May 10, 2017 · c1bbe55 · c1bbe55
1 parent 41d9859
commit c1bbe55
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-truncate-collapsed",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "A simple component that truncates your text and adds a 'Read More/Show Less' clickable.",
   "main": "truncate.vue",
   "scripts": {

diff --git a/truncate.vue b/truncate.vue
@@ -1,18 +1,22 @@
 <template>
 <p>
-  <span v-if="!show">{{truncate(text)}} <a @click="toggle()">{{clamp || 'Read More'}}</a></span>
-  <span v-if="show">{{text}} <a @click="toggle()">{{less || 'Show Less'}}</a></span>
+  <span v-if="!show">{{truncate(text)}} <a v-if="text.length <= length" @click="toggle()">{{clamp || 'Read More'}}</a></span>
+  <span v-if="show">{{text}} <a @click="toggle()" v-if="text.length <= length">{{less || 'Show Less'}}</a></span>
 </p>
 </template>
 
 <script>
 export default {
 
   name: 'truncate',
-  props: ['text', 'clamp', 'length', 'less'],
+  props: { 'text': String, 'clamp': String, 'length': Number, 'less': String },
   methods: {
     truncate(string) {
-      return string.toString().substring(0, this.length || 100);
+      if (string) {
+        return string.toString().substring(0, this.length || 100);
+      }
+
+      return '';
     },
     toggle() {
       this.show = !this.show;