Completely removing apache + phpmyadmin + php from Ubuntu?

Question

I have three component icons <DiscoverIcon>, <FeedIcon>, <ProfileIcon> and in tab loop I want to be able to use a different Icon for each respective title.

I tried a list element like

{ key: 1, icon: <div class='iconbgd'><DiscoverIcon /></div>, text: 'Discover', route: '/discover'}

and calling {{ link.icon }} and also

{ key: 1, text: 'Discover', route: '/discover'}

and calling <div class='iconbgd'><{{link.text}}Icon /></div>

<template>
  <v-tabs fixed-tabs>
    <v-tab
      v-for="link in links"
      :key="link.key"
    >
      <div class='iconbgd'><{{link.text}}Icon /></div><h4>{{ link.text }}</h4>
    </v-tab>
  </v-tabs>
</template>
<script>
import DiscoverIcon from '../components/icons/DiscoverIcon'
import FeedIcon from '../components/icons/FeedIcon'
import ProfileIcon from '../components/icons/ProfileIcon' 

export default {
  components: {
      DiscoverIcon,
      FeedIcon,
      ProfileIcon
    },
  name: 'App',
  data () {
    return {
      links: [
          { key: 1, icon: <div class='iconbgd'><DiscoverIcon /></div>, text: 'Discover', route: '/discover'},
          { key: 2, icon: <div class='iconbgd'><FeedIcon /></div>, text: 'Feed', route: '/feed'},
          { key: 3, icon: <div class='iconbgd'><ProfileIcon /></div>, text: 'Profile', route: '/profile'}
      ]
    }
  }
}
</script>


<style>
.iconbgd svg{
  fill:url(#grad1);
  width: 30px;
  height: auto;
  padding-right: 5px;
}
</style>

This is the Vuetify tabs component for this use case but getting it working isn't connected with using tabs but my expected result is to be able to loop through and in each tab use a different correlated component rather than just create three separate buttons which I currently have.

Solution 1

You should use --purge like this

apt-get --purge remove PACKAGE

in order to remove configuration files when you remove packages. It works even with autoremove.

For further information you can read

man apt-get

(obviously you need root privileges)

Solution 2

Run the following:

sudo apt-get purge libapache2-mod-auth-mysql phpmyadmin

sudo apt-get purge mysql-server mysql-server-5.1 mysql-server-core-5.1

sudo apt-get purge apache2 apache2-mpm-prefork apache2-utils apache2.2-bin apache2.2-common libapache2-mod-php5

sudo apt-get autoremove

It will flush out all stuffs behind the scene. ):

Comments

[Jackson Miller]

Can you share what your Icon components are? It seems like Vuetify's support for custom icons will already do what you need.

[Jordan]

I made my own icons in adobe illustrator so they're not from material icons. Maybe there's a way to make them perform in v-icon like that but idk this worked fine though. this was what one of my icon components looked like. wait this my first post so idk how to add that code. the component just has a template with an svg in it though

[chr]

you are welcome, could you make my solution as the right answer :)?

[Jordan]

Yeah sure! Although people reading this should note the tweaks I made to make it work in this answer. Thanks for your help!